<!DOCTYPE html>
<!-- saved from url=(0034)https://bbruceyuan.com/post/9.html -->
<html lang="zh-CN" data-theme="light" class=" ">

<head>
  <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">

  <meta name="viewport" content="width=device-width,initial-scale=1">
  <meta name="generator" content="VuePress 2.0.0-rc.0">
  <meta name="theme" content="VuePress Theme Hope 2.0.0-rc.2">
  <style>
    html {
      background: var(--bg-color, #fff);
    }

    html[data-theme="dark"] {
      background: var(--bg-color, #1d1e1f);
    }

    body {
      background: var(--bg-color);
    }
  </style>
  <script>
    const userMode = localStorage.getItem("vuepress-theme-hope-scheme");
    const systemDarkMode =
      window.matchMedia &&
      window.matchMedia("(prefers-color-scheme: dark)").matches;

    if (userMode === "dark" || (userMode !== "light" && systemDarkMode)) {
      document.documentElement.setAttribute("data-theme", "dark");
    }
  </script>

  <link rel="preload" href="./增加query多样性_files/style-22RAP--x.css" as="style">
  <link rel="stylesheet" href="./增加query多样性_files/style-22RAP--x.css">
  <link rel="modulepreload" href="./增加query多样性_files/app-8qgy8Op5.js">
  <link rel="modulepreload" href="https://bbruceyuan.com/assets/index.html-ghr71gpt.js">
  <link rel="modulepreload" href="https://bbruceyuan.com/assets/index.html-1104_cTf.js">
  <link rel="modulepreload" href="https://bbruceyuan.com/assets/plugin-vue_export-helper-x3n3nnut.js">
  <link rel="prefetch" href="https://bbruceyuan.com/assets/about.html-OLFuC2Fj.js" as="script">
  <link rel="prefetch" href="https://bbruceyuan.com/assets/blog.html-6hv_cNL_.js" as="script">
  <link rel="prefetch" href="https://bbruceyuan.com/assets/link.html-SSqHMSGs.js" as="script">
  <link rel="prefetch" href="https://bbruceyuan.com/assets/make-flomo-better.html-ToRMMi-e.js" as="script">
  <link rel="prefetch" href="https://bbruceyuan.com/assets/index.html-MkPlNrlC.js" as="script">
  <link rel="prefetch" href="https://bbruceyuan.com/assets/ad-nums.html-BV7RuJKE.js" as="script">
  <link rel="prefetch" href="https://bbruceyuan.com/assets/quick-tutorial.html-lvy99PWM.js" as="script">
  <link rel="prefetch" href="https://bbruceyuan.com/assets/index.html-HY1dIpZY.js" as="script">
  <link rel="prefetch" href="https://bbruceyuan.com/assets/python-type-challenge-advanced.html-FrPJouRs.js" as="script">
  <link rel="prefetch" href="https://bbruceyuan.com/assets/python-type-challenge-basic.html-vWrw0V3G.js" as="script">
  <link rel="prefetch" href="https://bbruceyuan.com/assets/python-type-challenge-intermediate.html-Q_ChJzmZ.js"
    as="script">
  <link rel="prefetch" href="https://bbruceyuan.com/assets/raycast-tutorial-1.html-5USXmw4k.js" as="script">
  <link rel="prefetch" href="https://bbruceyuan.com/assets/15.html-dAq_xhXl.js" as="script">
  <link rel="prefetch" href="https://bbruceyuan.com/assets/34.html-jurwCqo6.js" as="script">
  <link rel="prefetch" href="https://bbruceyuan.com/assets/35.html-OeG-218m.js" as="script">
  <link rel="prefetch" href="https://bbruceyuan.com/assets/1.html-j4lVin03.js" as="script">
  <link rel="prefetch" href="https://bbruceyuan.com/assets/10.html-42btxdVA.js" as="script">
  <link rel="prefetch" href="https://bbruceyuan.com/assets/17.html-oNJkaWZ7.js" as="script">
  <link rel="prefetch" href="https://bbruceyuan.com/assets/2.html--K-qupig.js" as="script">
  <link rel="prefetch" href="https://bbruceyuan.com/assets/29.html-9jMe2P7b.js" as="script">
  <link rel="prefetch" href="https://bbruceyuan.com/assets/3.html-5Jj3s0A9.js" as="script">
  <link rel="prefetch" href="https://bbruceyuan.com/assets/5.html-3CYwh7Gs.js" as="script">
  <link rel="prefetch" href="https://bbruceyuan.com/assets/7.html-8bjD78ue.js" as="script">
  <link rel="prefetch" href="https://bbruceyuan.com/assets/8.html-SJ34zrrK.js" as="script">
  <link rel="prefetch" href="https://bbruceyuan.com/assets/9.html-tl1vjZwz.js" as="script">
  <link rel="prefetch" href="https://bbruceyuan.com/assets/11.html-MrtpwURu.js" as="script">
  <link rel="prefetch" href="https://bbruceyuan.com/assets/12.html-ef61Aupj.js" as="script">
  <link rel="prefetch" href="https://bbruceyuan.com/assets/13.html-pZ0O_GTW.js" as="script">
  <link rel="prefetch" href="https://bbruceyuan.com/assets/14.html-hmmYIeQT.js" as="script">
  <link rel="prefetch" href="https://bbruceyuan.com/assets/16.html-qGGsEpV3.js" as="script">
  <link rel="prefetch" href="https://bbruceyuan.com/assets/18.html-_XjnlK7m.js" as="script">
  <link rel="prefetch" href="https://bbruceyuan.com/assets/19.html-a4bAYzsc.js" as="script">
  <link rel="prefetch" href="https://bbruceyuan.com/assets/20.html-k2ZDWn15.js" as="script">
  <link rel="prefetch" href="https://bbruceyuan.com/assets/21.html-ta87l2pK.js" as="script">
  <link rel="prefetch" href="https://bbruceyuan.com/assets/22.html-KkQDPAwm.js" as="script">
  <link rel="prefetch" href="https://bbruceyuan.com/assets/23.html-EoGUGYJb.js" as="script">
  <link rel="prefetch" href="https://bbruceyuan.com/assets/24.html-aU46Vjju.js" as="script">
  <link rel="prefetch" href="https://bbruceyuan.com/assets/25.html-esqjqTNv.js" as="script">
  <link rel="prefetch" href="https://bbruceyuan.com/assets/26.html-n89zJorf.js" as="script">
  <link rel="prefetch" href="https://bbruceyuan.com/assets/27.html-7vP2HYOx.js" as="script">
  <link rel="prefetch" href="https://bbruceyuan.com/assets/28.html-i5_AnBkJ.js" as="script">
  <link rel="prefetch" href="https://bbruceyuan.com/assets/30.html-4ctBqcxW.js" as="script">
  <link rel="prefetch" href="https://bbruceyuan.com/assets/31.html-nNlp8IZG.js" as="script">
  <link rel="prefetch" href="https://bbruceyuan.com/assets/32.html-UsaTVrn3.js" as="script">
  <link rel="prefetch" href="https://bbruceyuan.com/assets/33.html-ALOnhIsR.js" as="script">
  <link rel="prefetch" href="https://bbruceyuan.com/assets/4.html--qTdT8xg.js" as="script">
  <link rel="prefetch" href="https://bbruceyuan.com/assets/404.html-BIiorWTi.js" as="script">
  <link rel="prefetch" href="https://bbruceyuan.com/assets/index.html-FdJ8r1Z4.js" as="script">
  <link rel="prefetch" href="https://bbruceyuan.com/assets/index.html-sVQnITyX.js" as="script">
  <link rel="prefetch" href="https://bbruceyuan.com/assets/index.html-6lPemxyR.js" as="script">
  <link rel="prefetch" href="https://bbruceyuan.com/assets/index.html-4pddMOzK.js" as="script">
  <link rel="prefetch" href="https://bbruceyuan.com/assets/index.html-KHGQHQn2.js" as="script">
  <link rel="prefetch" href="https://bbruceyuan.com/assets/index.html-TwQDtLPb.js" as="script">
  <link rel="prefetch" href="https://bbruceyuan.com/assets/index.html-WJ7DOmRx.js" as="script">
  <link rel="prefetch" href="https://bbruceyuan.com/assets/index.html-0xVUzUuX.js" as="script">
  <link rel="prefetch" href="https://bbruceyuan.com/assets/index.html-CbHZzB0U.js" as="script">
  <link rel="prefetch" href="https://bbruceyuan.com/assets/index.html-sZeu82bh.js" as="script">
  <link rel="prefetch" href="https://bbruceyuan.com/assets/index.html-WPw-eUuo.js" as="script">
  <link rel="prefetch" href="https://bbruceyuan.com/assets/index.html-VOeBXPqT.js" as="script">
  <link rel="prefetch" href="https://bbruceyuan.com/assets/index.html-29doGqM9.js" as="script">
  <link rel="prefetch" href="https://bbruceyuan.com/assets/index.html-QhHjuue0.js" as="script">
  <link rel="prefetch" href="https://bbruceyuan.com/assets/index.html-doFQLnu_.js" as="script">
  <link rel="prefetch" href="https://bbruceyuan.com/assets/index.html-8fg3fiOO.js" as="script">
  <link rel="prefetch" href="https://bbruceyuan.com/assets/index.html-LUnkO7S8.js" as="script">
  <link rel="prefetch" href="https://bbruceyuan.com/assets/index.html-xvajiY1E.js" as="script">
  <link rel="prefetch" href="https://bbruceyuan.com/assets/index.html-pr6Z8mOE.js" as="script">
  <link rel="prefetch" href="https://bbruceyuan.com/assets/index.html-OLRwE57d.js" as="script">
  <link rel="prefetch" href="https://bbruceyuan.com/assets/index.html-Eei09d6d.js" as="script">
  <link rel="prefetch" href="https://bbruceyuan.com/assets/index.html-nx3jvSJy.js" as="script">
  <link rel="prefetch" href="https://bbruceyuan.com/assets/index.html-TSHrRgFS.js" as="script">
  <link rel="prefetch" href="https://bbruceyuan.com/assets/index.html-MQzrx0sY.js" as="script">
  <link rel="prefetch" href="https://bbruceyuan.com/assets/index.html-qHPTRSUH.js" as="script">
  <link rel="prefetch" href="https://bbruceyuan.com/assets/index.html-Qz2exNEk.js" as="script">
  <link rel="prefetch" href="https://bbruceyuan.com/assets/index.html-gM2TLjJ5.js" as="script">
  <link rel="prefetch" href="https://bbruceyuan.com/assets/index.html-Y8L1xSOA.js" as="script">
  <link rel="prefetch" href="https://bbruceyuan.com/assets/index.html-SqbDcw_v.js" as="script">
  <link rel="prefetch" href="https://bbruceyuan.com/assets/index.html-xr9MJUeb.js" as="script">
  <link rel="prefetch" href="https://bbruceyuan.com/assets/index.html-bckDH1V0.js" as="script">
  <link rel="prefetch" href="https://bbruceyuan.com/assets/index.html-i7gP9ulS.js" as="script">
  <link rel="prefetch" href="https://bbruceyuan.com/assets/about.html-jL6cOLLG.js" as="script">
  <link rel="prefetch" href="https://bbruceyuan.com/assets/blog.html-eIX8GjO7.js" as="script">
  <link rel="prefetch" href="https://bbruceyuan.com/assets/link.html-xWwWHe1u.js" as="script">
  <link rel="prefetch" href="https://bbruceyuan.com/assets/make-flomo-better.html-SQ3YRcpG.js" as="script">
  <link rel="prefetch" href="https://bbruceyuan.com/assets/index.html-yzdmC1IC.js" as="script">
  <link rel="prefetch" href="https://bbruceyuan.com/assets/ad-nums.html-Akwchasr.js" as="script">
  <link rel="prefetch" href="https://bbruceyuan.com/assets/quick-tutorial.html-yZd1AwNh.js" as="script">
  <link rel="prefetch" href="https://bbruceyuan.com/assets/index.html-rxsy1BNE.js" as="script">
  <link rel="prefetch" href="https://bbruceyuan.com/assets/python-type-challenge-advanced.html-85k8jZgg.js" as="script">
  <link rel="prefetch" href="https://bbruceyuan.com/assets/python-type-challenge-basic.html-4wAQjdQs.js" as="script">
  <link rel="prefetch" href="https://bbruceyuan.com/assets/python-type-challenge-intermediate.html-aG4zN8Qu.js"
    as="script">
  <link rel="prefetch" href="https://bbruceyuan.com/assets/raycast-tutorial-1.html-KVn47w_u.js" as="script">
  <link rel="prefetch" href="https://bbruceyuan.com/assets/15.html-n5iWoO48.js" as="script">
  <link rel="prefetch" href="https://bbruceyuan.com/assets/34.html-F27HNGJ2.js" as="script">
  <link rel="prefetch" href="https://bbruceyuan.com/assets/35.html-slEVu1mc.js" as="script">
  <link rel="prefetch" href="https://bbruceyuan.com/assets/1.html-LfCJ5FSj.js" as="script">
  <link rel="prefetch" href="https://bbruceyuan.com/assets/10.html-kLVEUdFc.js" as="script">
  <link rel="prefetch" href="https://bbruceyuan.com/assets/17.html-5AQmBmzS.js" as="script">
  <link rel="prefetch" href="https://bbruceyuan.com/assets/2.html-6AbEa_F6.js" as="script">
  <link rel="prefetch" href="https://bbruceyuan.com/assets/29.html-OM78VAUC.js" as="script">
  <link rel="prefetch" href="https://bbruceyuan.com/assets/3.html-7ASQmugO.js" as="script">
  <link rel="prefetch" href="https://bbruceyuan.com/assets/5.html-hF2av9dz.js" as="script">
  <link rel="prefetch" href="https://bbruceyuan.com/assets/7.html--5UrlBhe.js" as="script">
  <link rel="prefetch" href="https://bbruceyuan.com/assets/8.html-1abdq9l_.js" as="script">
  <link rel="prefetch" href="https://bbruceyuan.com/assets/9.html-a14oAg44.js" as="script">
  <link rel="prefetch" href="https://bbruceyuan.com/assets/11.html-1__bJ5_D.js" as="script">
  <link rel="prefetch" href="https://bbruceyuan.com/assets/12.html-JrN6JKsY.js" as="script">
  <link rel="prefetch" href="https://bbruceyuan.com/assets/13.html-3KDJTgCT.js" as="script">
  <link rel="prefetch" href="https://bbruceyuan.com/assets/14.html-n0strv5a.js" as="script">
  <link rel="prefetch" href="https://bbruceyuan.com/assets/16.html-m0FWFrL1.js" as="script">
  <link rel="prefetch" href="https://bbruceyuan.com/assets/18.html-piO6nOmQ.js" as="script">
  <link rel="prefetch" href="https://bbruceyuan.com/assets/19.html-_MkNtobQ.js" as="script">
  <link rel="prefetch" href="https://bbruceyuan.com/assets/20.html-j6Vq7E5w.js" as="script">
  <link rel="prefetch" href="https://bbruceyuan.com/assets/21.html-j_59L9Ff.js" as="script">
  <link rel="prefetch" href="https://bbruceyuan.com/assets/22.html-r241zKUU.js" as="script">
  <link rel="prefetch" href="https://bbruceyuan.com/assets/23.html-xny7p3t3.js" as="script">
  <link rel="prefetch" href="https://bbruceyuan.com/assets/24.html-vB9eBRx5.js" as="script">
  <link rel="prefetch" href="https://bbruceyuan.com/assets/25.html-o_HJztqM.js" as="script">
  <link rel="prefetch" href="https://bbruceyuan.com/assets/26.html-Y2_wCJaZ.js" as="script">
  <link rel="prefetch" href="https://bbruceyuan.com/assets/27.html-g-rLWcWa.js" as="script">
  <link rel="prefetch" href="https://bbruceyuan.com/assets/28.html-tr1HlGBq.js" as="script">
  <link rel="prefetch" href="https://bbruceyuan.com/assets/30.html-Dtfg1Gkr.js" as="script">
  <link rel="prefetch" href="https://bbruceyuan.com/assets/31.html-8GowCz9R.js" as="script">
  <link rel="prefetch" href="https://bbruceyuan.com/assets/32.html-N_zTLtKK.js" as="script">
  <link rel="prefetch" href="https://bbruceyuan.com/assets/33.html-2ko4F3Lx.js" as="script">
  <link rel="prefetch" href="https://bbruceyuan.com/assets/4.html--ZcKPAot.js" as="script">
  <link rel="prefetch" href="https://bbruceyuan.com/assets/404.html-sXTA4-oh.js" as="script">
  <link rel="prefetch" href="https://bbruceyuan.com/assets/index.html-0PaAuqd6.js" as="script">
  <link rel="prefetch" href="https://bbruceyuan.com/assets/index.html--dVkvcUG.js" as="script">
  <link rel="prefetch" href="https://bbruceyuan.com/assets/index.html-AIv0zz5y.js" as="script">
  <link rel="prefetch" href="https://bbruceyuan.com/assets/index.html-_SvvrE3a.js" as="script">
  <link rel="prefetch" href="https://bbruceyuan.com/assets/index.html-0ePTVLCF.js" as="script">
  <link rel="prefetch" href="https://bbruceyuan.com/assets/index.html--PIuUFcl.js" as="script">
  <link rel="prefetch" href="https://bbruceyuan.com/assets/index.html-XCJxRs82.js" as="script">
  <link rel="prefetch" href="https://bbruceyuan.com/assets/index.html-hnC73brg.js" as="script">
  <link rel="prefetch" href="https://bbruceyuan.com/assets/index.html-SvgfCMDb.js" as="script">
  <link rel="prefetch" href="https://bbruceyuan.com/assets/index.html-_srrwEe6.js" as="script">
  <link rel="prefetch" href="https://bbruceyuan.com/assets/index.html-l8RxSP3t.js" as="script">
  <link rel="prefetch" href="https://bbruceyuan.com/assets/index.html-tAAGnDiW.js" as="script">
  <link rel="prefetch" href="https://bbruceyuan.com/assets/index.html-i34RDhso.js" as="script">
  <link rel="prefetch" href="https://bbruceyuan.com/assets/index.html-zjVDS9W3.js" as="script">
  <link rel="prefetch" href="https://bbruceyuan.com/assets/index.html-tMT57Gz6.js" as="script">
  <link rel="prefetch" href="https://bbruceyuan.com/assets/index.html-4fhU1lnV.js" as="script">
  <link rel="prefetch" href="https://bbruceyuan.com/assets/index.html-Htgjjeua.js" as="script">
  <link rel="prefetch" href="https://bbruceyuan.com/assets/index.html-pMUcpDVz.js" as="script">
  <link rel="prefetch" href="https://bbruceyuan.com/assets/index.html-2s63qjJj.js" as="script">
  <link rel="prefetch" href="https://bbruceyuan.com/assets/index.html-b8WYNNUx.js" as="script">
  <link rel="prefetch" href="https://bbruceyuan.com/assets/index.html-rj7NWYwW.js" as="script">
  <link rel="prefetch" href="https://bbruceyuan.com/assets/index.html-OvUMHZxI.js" as="script">
  <link rel="prefetch" href="https://bbruceyuan.com/assets/index.html-L2i1HfhR.js" as="script">
  <link rel="prefetch" href="https://bbruceyuan.com/assets/index.html-RU0lk6Zi.js" as="script">
  <link rel="prefetch" href="https://bbruceyuan.com/assets/index.html-wwdLykFt.js" as="script">
  <link rel="prefetch" href="https://bbruceyuan.com/assets/index.html--Wa7Q-36.js" as="script">
  <link rel="prefetch" href="https://bbruceyuan.com/assets/index.html-ILnC-NaF.js" as="script">
  <link rel="prefetch" href="https://bbruceyuan.com/assets/index.html-TE6kdbkj.js" as="script">
  <link rel="prefetch" href="https://bbruceyuan.com/assets/index.html-_jsVfpSk.js" as="script">
  <link rel="prefetch" href="https://bbruceyuan.com/assets/index.html-w9Qrmqkn.js" as="script">
  <link rel="prefetch" href="https://bbruceyuan.com/assets/index.html-PYja007X.js" as="script">
  <link rel="prefetch" href="https://bbruceyuan.com/assets/index.html-E4gDlnzq.js" as="script">
  <link rel="prefetch" href="https://bbruceyuan.com/assets/giscus-unEZQsJ0.js" as="script">
  <link rel="prefetch" href="https://bbruceyuan.com/assets/photoswipe.esm-i2ohwMnJ.js" as="script">
  <link rel="prefetch" href="https://bbruceyuan.com/assets/SearchResult-R_gJnaIQ.js" as="script">
  <script src="./增加query多样性_files/js" async=""></script>
  <style type="text/css">
    .simpread-theme-root {
      font-size: 62.5% !important
    }

    sr-rd-content,
    sr-rd-desc,
    sr-rd-title {
      width: 100%
    }

    sr-rd-title {
      display: -webkit-box;
      margin: 1em 0 .5em;
      overflow: hidden;
      text-overflow: ellipsis;
      text-rendering: optimizelegibility;
      -webkit-line-clamp: 3;
      -webkit-box-orient: vertical
    }

    sr-rd-content {
      text-align: left;
      word-break: break-word
    }

    sr-rd-desc {
      text-align: justify;
      line-height: 2.4;
      margin: 0 0 1.2em;
      box-sizing: border-box
    }

    sr-rd-content {
      font-size: 25.6px;
      font-size: 1.6rem;
      line-height: 1.6
    }

    sr-rd-content h1,
    sr-rd-content h1 *,
    sr-rd-content h2,
    sr-rd-content h2 *,
    sr-rd-content h3,
    sr-rd-content h3 *,
    sr-rd-content h4,
    sr-rd-content h4 *,
    sr-rd-content h5,
    sr-rd-content h5 *,
    sr-rd-content h6,
    sr-rd-content h6 * {
      word-break: break-all
    }

    sr-rd-content div,
    sr-rd-content p {
      display: block;
      float: inherit;
      line-height: 1.6;
      font-size: 25.6px;
      font-size: 1.6rem
    }

    sr-rd-content div,
    sr-rd-content p,
    sr-rd-content pre,
    sr-rd-content sr-blockquote {
      margin: 0 0 1.2em;
      word-break: break-word
    }

    sr-rd-content a {
      padding: 0 5px;
      vertical-align: baseline;
      vertical-align: initial
    }

    sr-rd-content a,
    sr-rd-content a:link {
      color: inherit;
      font-size: inherit;
      font-weight: inherit;
      border: none
    }

    sr-rd-content a:hover {
      background: transparent
    }

    sr-rd-content img {
      margin: 10px;
      padding: 5px;
      max-width: 100%;
      background: #fff;
      border: 1px solid #bbb;
      box-shadow: 1px 1px 3px #d4d4d4
    }

    sr-rd-content figcaption {
      text-align: center;
      font-size: 14px
    }

    sr-rd-content sr-blockquote {
      display: block;
      position: relative;
      padding: 15px 25px;
      text-align: left;
      line-height: inherit
    }

    sr-rd-content sr-blockquote:before {
      position: absolute
    }

    sr-rd-content sr-blockquote * {
      margin: 0;
      font-size: inherit
    }

    sr-rd-content table {
      width: 100%;
      margin: 0 0 1.2em;
      word-break: keep-all;
      word-break: normal;
      overflow: auto;
      border: none
    }

    sr-rd-content table td,
    sr-rd-content table th {
      border: none
    }

    sr-rd-content ul {
      margin: 0 0 1.2em;
      margin-left: 1.3em;
      padding: 0;
      list-style: disc
    }

    sr-rd-content ol {
      list-style: decimal;
      margin: 0;
      padding: 0
    }

    sr-rd-content ol li,
    sr-rd-content ul li {
      font-size: inherit;
      list-style: disc;
      margin: 0 0 1.2em
    }

    sr-rd-content ol li {
      list-style: decimal;
      margin-left: 1.3em
    }

    sr-rd-content ol li *,
    sr-rd-content ul li * {
      margin: 0;
      text-align: left;
      text-align: initial
    }

    sr-rd-content li ol,
    sr-rd-content li ul {
      margin-bottom: .8em;
      margin-left: 2em
    }

    sr-rd-content li ul {
      list-style: circle
    }

    sr-rd-content pre {
      font-family: Consolas, Monaco, Andale Mono, Source Code Pro, Liberation Mono, Courier, monospace;
      display: block;
      padding: 15px;
      line-height: 1.5;
      word-break: break-all;
      word-wrap: break-word;
      white-space: pre;
      overflow: auto
    }

    sr-rd-content pre,
    sr-rd-content pre *,
    sr-rd-content pre div {
      font-size: 17.6px;
      font-size: 1.1rem
    }

    sr-rd-content li pre code,
    sr-rd-content p pre code,
    sr-rd-content pre {
      background-color: transparent;
      border: none
    }

    sr-rd-content pre code {
      margin: 0;
      padding: 0
    }

    sr-rd-content pre code,
    sr-rd-content pre code * {
      font-size: 17.6px;
      font-size: 1.1rem
    }

    sr-rd-content pre p {
      margin: 0;
      padding: 0;
      color: inherit;
      font-size: inherit;
      line-height: inherit
    }

    sr-rd-content li code,
    sr-rd-content p code {
      margin: 0 4px;
      padding: 2px 4px;
      font-size: 17.6px;
      font-size: 1.1rem
    }

    sr-rd-content mark {
      margin: 0 5px;
      padding: 2px;
      background: #fffdd1;
      border-bottom: 1px solid #ffedce
    }

    .sr-rd-content-img {
      width: 90%;
      height: auto
    }

    .sr-rd-content-img-load {
      width: 48px;
      height: 48px;
      margin: 0;
      padding: 0;
      border-style: none;
      border-width: 0;
      background-repeat: no-repeat;
      background-image: url()
    }

    .sr-rd-content-center {
      text-align: center;
      display: -webkit-box;
      -webkit-box-align: center;
      -webkit-box-pack: center;
      -webkit-box-orient: vertical
    }

    .sr-rd-content-center-small {
      display: -webkit-inline-box;
      display: -ms-inline-flexbox;
      display: inline-flex
    }

    .sr-rd-content-center-small img {
      margin: 0;
      padding: 0;
      border: 0;
      box-shadow: none
    }

    img.simpread-img-broken {
      cursor: pointer
    }

    .sr-rd-content-nobeautify {
      margin: 0;
      padding: 0;
      border: 0;
      box-shadow: 0 0 0
    }

    sr-rd-mult {
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-orient: horizontal;
      -webkit-box-direction: normal;
      -ms-flex-direction: row;
      flex-direction: row;
      margin: 0 0 16px;
      padding: 16px 0 24px;
      width: 100%;
      background-color: #fff;
      border-radius: 4px;
      box-shadow: 0 1px 2px 0 rgba(60, 64, 67, .3), 0 2px 6px 2px rgba(60, 64, 67, .15)
    }

    sr-rd-mult:hover {
      -webkit-transition: all .45s 0ms;
      transition: all .45s 0ms;
      box-shadow: 1px 1px 8px rgba(0, 0, 0, .16)
    }

    sr-rd-mult sr-rd-mult-content {
      padding: 0 16px;
      overflow: auto
    }

    sr-rd-mult sr-rd-mult-avatar,
    sr-rd-mult sr-rd-mult-content {
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-orient: vertical;
      -webkit-box-direction: normal;
      -ms-flex-direction: column;
      flex-direction: column
    }

    sr-rd-mult sr-rd-mult-avatar {
      -webkit-box-align: center;
      -ms-flex-align: center;
      align-items: center;
      margin: 0 15px
    }

    sr-rd-mult sr-rd-mult-avatar span {
      display: -webkit-box;
      -webkit-line-clamp: 1;
      -webkit-box-orient: vertical;
      max-width: 75px;
      overflow: hidden;
      text-overflow: ellipsis;
      text-align: left;
      font-size: 16px;
      font-size: 1rem
    }

    sr-rd-mult sr-rd-mult-avatar img {
      margin-bottom: 0;
      max-width: 50px;
      max-height: 50px;
      width: 50px;
      height: 50px;
      border-radius: 50%
    }

    sr-rd-mult sr-rd-mult-content img {
      max-width: 80%
    }

    sr-rd-mult sr-rd-mult-avatar .sr-rd-content-center {
      margin: 0
    }

    sr-page {
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-orient: horizontal;
      -webkit-box-direction: normal;
      -ms-flex-direction: row;
      flex-direction: row;
      -webkit-box-pack: justify;
      -ms-flex-pack: justify;
      justify-content: space-between;
      width: 100%
    }
  </style>
  <style type="text/css">
    sr-rd-theme-github {
      display: none
    }

    sr-rd-content h1,
    sr-rd-content h2,
    sr-rd-content h3,
    sr-rd-content h4,
    sr-rd-content h5,
    sr-rd-content h6 {
      position: relative;
      margin-top: 1em;
      margin-bottom: 1pc;
      font-weight: 700;
      line-height: 1.4;
      text-align: left;
      color: #363636
    }

    sr-rd-content h1 {
      padding-bottom: .3em;
      font-size: 57.6px;
      font-size: 3.6rem;
      line-height: 1.2
    }

    sr-rd-content h2 {
      padding-bottom: .3em;
      font-size: 44.8px;
      font-size: 2.8rem;
      line-height: 1.225
    }

    sr-rd-content h3 {
      font-size: 38.4px;
      font-size: 2.4rem;
      line-height: 1.43
    }

    sr-rd-content h4 {
      font-size: 32px;
      font-size: 2rem
    }

    sr-rd-content h5,
    sr-rd-content h6 {
      font-size: 25.6px;
      font-size: 1.6rem
    }

    sr-rd-content h6 {
      color: #777
    }

    sr-rd-content ol,
    sr-rd-content ul {
      list-style-type: disc;
      padding: 0;
      padding-left: 2em
    }

    sr-rd-content ol ol,
    sr-rd-content ul ol {
      list-style-type: lower-roman
    }

    sr-rd-content ol ol ol,
    sr-rd-content ol ul ol,
    sr-rd-content ul ol ol,
    sr-rd-content ul ul ol {
      list-style-type: lower-alpha
    }

    sr-rd-content table {
      width: 100%;
      overflow: auto;
      word-break: normal;
      word-break: keep-all
    }

    sr-rd-content table th {
      font-weight: 700
    }

    sr-rd-content table td,
    sr-rd-content table th {
      padding: 6px 13px;
      border: 1px solid #ddd
    }

    sr-rd-content table tr {
      background-color: #fff;
      border-top: 1px solid #ccc
    }

    sr-rd-content table tr:nth-child(2n) {
      background-color: #f8f8f8
    }

    sr-rd-content sr-blockquote {
      border-left: 4px solid #ddd
    }

    .simpread-theme-root {
      background-color: #fff;
      color: #333
    }

    sr-rd-title {
      font-family: PT Sans, SF UI Display, \.PingFang SC, PingFang SC, Neue Haas Grotesk Text Pro, Arial Nova, Segoe UI, Microsoft YaHei, Microsoft JhengHei, Helvetica Neue, Source Han Sans SC, Noto Sans CJK SC, Source Han Sans CN, Noto Sans SC, Source Han Sans TC, Noto Sans CJK TC, Hiragino Sans GB, sans-serif;
      font-size: 54.4px;
      font-size: 3.4rem;
      font-weight: 700;
      line-height: 1.3
    }

    sr-rd-desc {
      position: relative;
      margin: 0;
      margin-bottom: 30px;
      padding: 25px;
      padding-left: 56px;
      font-size: 28.8px;
      font-size: 1.8rem;
      color: #777;
      background-color: rgba(0, 0, 0, .05);
      box-sizing: border-box
    }

    sr-rd-desc:before {
      content: "\201C";
      position: absolute;
      top: -28px;
      left: 16px;
      font-size: 80px;
      font-family: Arial;
      color: rgba(0, 0, 0, .15)
    }

    sr-rd-content,
    sr-rd-content *,
    sr-rd-content div,
    sr-rd-content p {
      color: #363636;
      font-weight: 400;
      line-height: 1.8
    }

    sr-rd-content b *,
    sr-rd-content strong,
    sr-rd-content strong * sr-rd-content b {
      -webkit-animation: none 0s ease 0s 1 normal none running;
      animation: none 0s ease 0s 1 normal none running;
      -webkit-backface-visibility: visible;
      backface-visibility: visible;
      background: transparent none repeat 0 0/auto auto padding-box border-box scroll;
      border: medium none currentColor;
      border-collapse: separate;
      -o-border-image: none;
      border-image: none;
      border-radius: 0;
      border-spacing: 0;
      bottom: auto;
      box-shadow: none;
      box-sizing: content-box;
      caption-side: top;
      clear: none;
      clip: auto;
      color: #000;
      -webkit-columns: auto;
      -moz-columns: auto;
      columns: auto;
      -webkit-column-count: auto;
      -moz-column-count: auto;
      column-count: auto;
      -webkit-column-fill: balance;
      -moz-column-fill: balance;
      column-fill: balance;
      -webkit-column-gap: normal;
      -moz-column-gap: normal;
      column-gap: normal;
      -webkit-column-rule: medium none currentColor;
      -moz-column-rule: medium none currentColor;
      column-rule: medium none currentColor;
      -webkit-column-span: 1;
      -moz-column-span: 1;
      column-span: 1;
      -webkit-column-width: auto;
      -moz-column-width: auto;
      column-width: auto;
      content: normal;
      counter-increment: none;
      counter-reset: none;
      cursor: auto;
      direction: ltr;
      display: inline;
      empty-cells: show;
      float: none;
      font-family: serif;
      font-size: medium;
      font-style: normal;
      font-variant: normal;
      font-weight: 400;
      font-stretch: normal;
      line-height: normal;
      height: auto;
      -webkit-hyphens: none;
      -ms-hyphens: none;
      hyphens: none;
      left: auto;
      letter-spacing: normal;
      list-style: disc outside none;
      margin: 0;
      max-height: none;
      max-width: none;
      min-height: 0;
      min-width: 0;
      opacity: 1;
      orphans: 2;
      outline: medium none invert;
      overflow: visible;
      overflow-x: visible;
      overflow-y: visible;
      padding: 0;
      page-break-after: auto;
      page-break-before: auto;
      page-break-inside: auto;
      -webkit-perspective: none;
      perspective: none;
      -webkit-perspective-origin: 50% 50%;
      perspective-origin: 50% 50%;
      position: static;
      right: auto;
      -moz-tab-size: 8;
      -o-tab-size: 8;
      tab-size: 8;
      table-layout: auto;
      text-align: left;
      text-align-last: auto;
      text-decoration: none;
      text-indent: 0;
      text-shadow: none;
      text-transform: none;
      top: auto;
      -webkit-transform: none;
      transform: none;
      -webkit-transform-origin: 50% 50% 0;
      transform-origin: 50% 50% 0;
      -webkit-transform-style: flat;
      transform-style: flat;
      -webkit-transition: none 0s ease 0s;
      transition: none 0s ease 0s;
      unicode-bidi: normal;
      vertical-align: baseline;
      visibility: visible;
      white-space: normal;
      widows: 2;
      width: auto;
      word-spacing: normal;
      z-index: auto;
      all: initial
    }

    sr-rd-content a,
    sr-rd-content a:link {
      color: #4183c4;
      text-decoration: none
    }

    sr-rd-content a:active,
    sr-rd-content a:focus,
    sr-rd-content a:hover {
      color: #4183c4;
      text-decoration: underline
    }

    sr-rd-content pre {
      background-color: #f7f7f7;
      border-radius: 3px
    }

    sr-rd-content li code,
    sr-rd-content p code {
      background-color: rgba(0, 0, 0, .04);
      border-radius: 3px
    }

    .simpread-multi-root {
      background: #f8f9fa
    }
  </style>
  <style type="text/css">
    sr-rd-theme-newsprint {
      display: none
    }

    sr-rd-content h1,
    sr-rd-content h2,
    sr-rd-content h3,
    sr-rd-content h4,
    sr-rd-content h5,
    sr-rd-content h6 {
      font-weight: 700
    }

    sr-rd-content h1 {
      font-size: 48px;
      font-size: 3rem;
      line-height: 1.6em;
      margin-top: 2em
    }

    sr-rd-content h2,
    sr-rd-content h3 {
      font-size: 32px;
      font-size: 2rem;
      line-height: 1.15;
      margin-top: 2.285714em;
      margin-bottom: 1.15em
    }

    sr-rd-content h3 {
      font-weight: 400
    }

    sr-rd-content h4 {
      font-size: 28.8px;
      font-size: 1.8rem;
      margin-top: 2.67em
    }

    sr-rd-content h5,
    sr-rd-content h6 {
      font-size: 25.6px;
      font-size: 1.6rem
    }

    sr-rd-content h1 {
      border-bottom: 1px solid;
      margin-bottom: 1.875em;
      padding-bottom: .8125em
    }

    sr-rd-content ol,
    sr-rd-content ul {
      margin: 0 0 1.5em 1.5em
    }

    sr-rd-content ol li {
      list-style-type: decimal;
      list-style-position: outside
    }

    sr-rd-content ul li {
      list-style-type: disc;
      list-style-position: outside
    }

    sr-rd-content table {
      width: 100%;
      margin-bottom: 1.5em;
      font-size: 25.6px;
      font-size: 1.6rem
    }

    sr-rd-content thead th,
    tfoot th {
      padding: .25em .25em .25em .4em;
      text-transform: uppercase
    }

    sr-rd-content th {
      text-align: left
    }

    sr-rd-content td {
      vertical-align: top;
      padding: .25em .25em .25em .4em
    }

    sr-rd-content thead {
      background-color: #dadada
    }

    sr-rd-content tr:nth-child(2n) {
      background: #e8e7e7
    }

    sr-rd-content sr-blockquote {
      padding: 10px 15px;
      border-left-style: solid;
      border-left-width: 10px;
      border-color: #d6dbdf;
      background: none repeat scroll 0 0 rgba(102, 128, 153, .05);
      text-align: left
    }

    sr-rd-content sr-blockquote:before {
      content: ""
    }

    .simpread-multi-root,
    .simpread-theme-root {
      background-color: #f3f2ee;
      color: #2c3e50
    }

    sr-rd-title {
      font-family: PingFang SC, Hiragino Sans GB, Microsoft Yahei, WenQuanYi Micro Hei, sans-serif;
      line-height: 1.5;
      font-weight: 500;
      font-size: 48px;
      font-size: 3rem;
      color: #07b;
      border-bottom: 1px solid;
      margin-bottom: 1.875em;
      padding-bottom: .8125em
    }

    sr-rd-desc {
      color: rgba(102, 128, 153, .6);
      background-color: rgba(102, 128, 153, .075);
      border-radius: 4px;
      margin-bottom: 1em;
      padding: 15px;
      font-size: 32px;
      font-size: 2rem;
      line-height: 1.5;
      text-align: center
    }

    sr-rd-content,
    sr-rd-content *,
    sr-rd-content div,
    sr-rd-content p {
      line-height: 1.8;
      color: #2c3e50
    }

    sr-rd-content a,
    sr-rd-content a:link {
      color: #08c;
      text-decoration: none
    }

    sr-rd-content a:active,
    sr-rd-content a:focus,
    sr-rd-content a:hover {
      color: #5ba4e5
    }

    sr-rd-content li code,
    sr-rd-content p code,
    sr-rd-content pre {
      background-color: #dadada
    }

    sr-rd-mult {
      background-color: rgba(102, 128, 153, .075)
    }
  </style>
  <style type="text/css">
    sr-rd-theme-gothic {
      display: none
    }

    sr-rd-content h1 {
      line-height: 64px;
      line-height: 4rem;
      margin: 64px 0 28px;
      margin: 4rem 0 1.75rem;
      padding: 20px 30px
    }

    sr-rd-content h1,
    sr-rd-content h2 {
      font-weight: 400;
      text-align: center;
      text-transform: uppercase
    }

    sr-rd-content h2 {
      line-height: 48px;
      line-height: 3rem;
      margin: 48px 0 31px;
      margin: 3rem 0 1.9375rem;
      padding: 0 30px
    }

    sr-rd-content h3,
    sr-rd-content h4,
    sr-rd-content h5 {
      font-weight: 400
    }

    sr-rd-content h6 {
      font-weight: 700
    }

    sr-rd-content h1 {
      font-size: 57.6px;
      font-size: 3.6rem
    }

    sr-rd-content h2 {
      font-size: 51.2px;
      font-size: 3.2rem
    }

    sr-rd-content h3 {
      font-size: 40px;
      font-size: 2.5rem
    }

    sr-rd-content h4 {
      font-size: 35.2px;
      font-size: 2.2rem
    }

    sr-rd-content h5 {
      font-size: 30.4px;
      font-size: 1.9rem
    }

    sr-rd-content h6 {
      font-size: 27.2px;
      font-size: 1.7rem
    }

    sr-rd-content h1,
    sr-rd-content h2,
    sr-rd-content h3,
    sr-rd-content h4,
    sr-rd-content h5,
    sr-rd-content h6 {
      margin-top: 1.2em;
      margin-bottom: .6em;
      color: #111
    }

    sr-rd-content ol,
    sr-rd-content ul {
      list-style-type: disc;
      margin-left: 3em
    }

    sr-rd-content ol ol,
    sr-rd-content ul ol {
      list-style-type: lower-roman
    }

    sr-rd-content ol ol ol,
    sr-rd-content ol ul ol,
    sr-rd-content ul ol ol,
    sr-rd-content ul ul ol {
      list-style-type: lower-alpha
    }

    sr-rd-content table {
      margin-bottom: 20px
    }

    sr-rd-content table td,
    sr-rd-content table th {
      padding: 8px;
      line-height: 20px;
      line-height: 1.25rem;
      vertical-align: top;
      border-top: 1px solid #ddd
    }

    sr-rd-content table th {
      font-weight: 700
    }

    sr-rd-content table thead th {
      vertical-align: bottom
    }

    sr-rd-content table caption+thead tr:first-child td,
    sr-rd-content table caption+thead tr:first-child th,
    sr-rd-content table colgroup+thead tr:first-child td,
    sr-rd-content table colgroup+thead tr:first-child th,
    sr-rd-content table thead:first-child tr:first-child td,
    sr-rd-content table thead:first-child tr:first-child th {
      border-top: 0
    }

    sr-rd-content table tbody+tbody {
      border-top: 2px solid #ddd
    }

    sr-rd-content sr-blockquote {
      margin: 0 0 17.777px;
      margin: 0 0 1.11111rem;
      padding: 8px 17.777px 0 16.888px;
      padding: .5rem 1.11111rem 0 1.05556rem;
      border-left: 1px solid gray
    }

    sr-rd-content sr-blockquote,
    sr-rd-content sr-blockquote p {
      line-height: 2;
      color: #6f6f6f
    }

    .simpread-multi-root,
    .simpread-theme-root {
      background: #fcfcfc;
      color: #333
    }

    sr-rd-title {
      font-weight: 400;
      line-height: 64px;
      line-height: 4rem;
      text-align: center;
      text-transform: uppercase;
      color: #111;
      font-size: 51.2px;
      font-size: 3.2rem
    }

    sr-rd-desc {
      margin: 0 0 17.777px;
      margin: 0 0 1.11111rem;
      padding: 8px 17.777px 0 16.888px;
      padding: .5rem 1.11111rem 0 1.05556rem;
      font-size: 32px;
      font-size: 2rem;
      line-height: 2;
      color: #6f6f6f;
      border-left: 1px solid gray
    }

    sr-rd-content {
      font-weight: 400;
      color: #333
    }

    sr-rd-content *,
    sr-rd-content div,
    sr-rd-content p {
      color: #333
    }

    sr-rd-content a,
    sr-rd-content a:link {
      color: #900;
      text-decoration: none
    }

    sr-rd-content a:active,
    sr-rd-content a:focus,
    sr-rd-content a:hover {
      color: #900;
      text-decoration: underline
    }

    sr-rd-content li code,
    sr-rd-content p code,
    sr-rd-content pre {
      background-color: transparent;
      border: 1px solid #ccc
    }

    sr-rd-mult {
      background-color: #f2f2f2
    }
  </style>
  <style type="text/css">
    sr-rd-theme-engwrite {
      display: none
    }

    sr-rd-content h1,
    sr-rd-content h2,
    sr-rd-content h3,
    sr-rd-content h4,
    sr-rd-content h5,
    sr-rd-content h6 {
      margin: 20px 0 10px;
      padding: 0;
      font-weight: 500;
      -webkit-font-smoothing: antialiased
    }

    sr-rd-content h1 {
      font-weight: 300;
      text-align: center;
      font-size: 44.8px;
      font-size: 2.8rem;
      color: #933d3f
    }

    sr-rd-content h2 {
      font-size: 38.4px;
      font-size: 2.4rem;
      border-bottom: 1px solid #ccc;
      color: #000
    }

    sr-rd-content h3 {
      font-size: 28.8px;
      font-size: 1.8rem
    }

    sr-rd-content h4,
    sr-rd-content h5,
    sr-rd-content h6 {
      font-size: 25.6px;
      font-size: 1.6rem
    }

    sr-rd-content h6 {
      color: #777
    }

    sr-rd-content ol,
    sr-rd-content ul {
      padding-left: 30px
    }

    sr-rd-content ol li>:first-child,
    sr-rd-content ol li ol:first-of-type,
    sr-rd-content ol li ul:first-of-type,
    sr-rd-content ul li>:first-child,
    sr-rd-content ul li ol:first-of-type,
    sr-rd-content ul li ul:first-of-type {
      margin-top: 0
    }

    sr-rd-content ol ol,
    sr-rd-content ol ul,
    sr-rd-content ul ol,
    sr-rd-content ul ul {
      margin-bottom: 0
    }

    sr-rd-content table th {
      font-weight: 700
    }

    sr-rd-content table td,
    sr-rd-content table th {
      border: 1px solid #ccc;
      padding: 6px 13px
    }

    sr-rd-content table tr {
      border-top: 1px solid #ccc;
      background-color: #fff
    }

    sr-rd-content table tr:nth-child(2n) {
      background-color: #f8f8f8
    }

    sr-rd-content sr-blockquote {
      text-align: left;
      border-top: 1px dotted #cdc7bc;
      border-bottom: 1px dotted #cdc7bc;
      background-color: #f8edda;
      color: #777
    }

    sr-blockquote>:first-child {
      margin-top: 0
    }

    sr-blockquote>:last-child {
      margin-bottom: 0
    }

    .simpread-multi-root,
    .simpread-theme-root {
      background-color: #fcf5ed;
      color: #333
    }

    sr-rd-title {
      font-weight: 300;
      text-align: center;
      font-size: 44.8px;
      font-size: 2.8rem;
      color: #933d3f
    }

    sr-rd-desc {
      padding: 10px;
      background-color: #f8edda;
      color: #777;
      font-size: 32px;
      font-size: 2rem;
      text-align: center;
      border-top: 1px dotted #cdc7bc;
      border-bottom: 1px dotted #cdc7bc
    }

    sr-rd-content {
      padding: 20px 0;
      margin: 0 auto
    }

    sr-rd-content,
    sr-rd-content *,
    sr-rd-content div,
    sr-rd-content p {
      color: #333;
      line-height: 1.8
    }

    sr-rd-content a,
    sr-rd-content a:link {
      color: #ae3737;
      text-decoration: none
    }

    sr-rd-content a:active,
    sr-rd-content a:focus,
    sr-rd-content a:hover {
      text-decoration: underline
    }

    sr-rd-content pre {
      background-color: transparent;
      border: 1px solid #ccc;
      border-radius: 3px
    }

    sr-rd-content li code,
    sr-rd-content p code {
      border: 1px solid #eaeaea;
      background-color: #f4ece3;
      border-radius: 3px
    }

    sr-rd-mult {
      background-color: #f8edda
    }
  </style>
  <style type="text/css">
    sr-rd-theme-octopress {
      display: none
    }

    sr-rd-content h1 {
      font-size: 56.32px;
      font-size: 3.52rem;
      line-height: 30.72px;
      line-height: 1.92rem
    }

    sr-rd-content h1,
    sr-rd-content h2,
    sr-rd-content h3,
    sr-rd-content h4,
    sr-rd-content h5,
    sr-rd-content h6 {
      text-rendering: optimizelegibility;
      margin-bottom: 20.8px;
      margin-bottom: 1.3rem;
      font-weight: 700
    }

    sr-rd-content h2 {
      font-size: 38.4px;
      font-size: 2.4rem
    }

    sr-rd-content h3 {
      font-size: 33.28px;
      font-size: 2.08rem
    }

    sr-rd-content h4 {
      font-size: 28.8px;
      font-size: 1.8rem
    }

    sr-rd-content h5,
    sr-rd-content h6 {
      font-size: 25.6px;
      font-size: 1.6rem
    }

    sr-rd-content h1,
    sr-rd-content h2 {
      padding-top: 27.2px;
      padding-top: 1.7rem;
      padding-bottom: 19.2px;
      padding-bottom: 1.2rem;
      background: url("") 0 100% repeat-x
    }

    sr-rd-content h2 {
      padding-top: 20.8px;
      padding-top: 1.3rem;
      padding-bottom: 0
    }

    sr-rd-content ul {
      list-style-type: disc
    }

    sr-rd-content ul ul {
      list-style-type: circle;
      margin-bottom: 0
    }

    sr-rd-content ul ul ul {
      list-style-type: square;
      margin-bottom: 0
    }

    sr-rd-content ol {
      list-style-type: decimal
    }

    sr-rd-content ol ol {
      list-style-type: lower-alpha;
      margin-bottom: 0
    }

    sr-rd-content ol ol ol {
      list-style-type: lower-roman;
      margin-bottom: 0
    }

    sr-rd-content ol,
    sr-rd-content ol ol,
    sr-rd-content ol ul,
    sr-rd-content ul,
    sr-rd-content ul ol,
    sr-rd-content ul ul {
      margin-left: 1.3em
    }

    sr-rd-content ol ol,
    sr-rd-content ol ul,
    sr-rd-content ul ol,
    sr-rd-content ul ul {
      margin-bottom: 0
    }

    sr-rd-content table {
      width: 100%;
      overflow: auto;
      word-break: normal;
      word-break: keep-all
    }

    sr-rd-content table th {
      font-weight: 700
    }

    sr-rd-content table td,
    sr-rd-content table th {
      padding: 6px 13px;
      border: 1px solid #ddd
    }

    sr-rd-content table tr {
      background-color: #fff;
      border-top: 1px solid #ccc
    }

    sr-rd-content table tr:nth-child(2n) {
      background-color: #f8f8f8
    }

    sr-rd-content sr-blockquote {
      font-style: italic;
      font-size: inherit;
      line-height: 2;
      padding-left: 1em;
      border-left: 4px solid hsla(0, 0%, 67%, .5)
    }

    .simpread-multi-root,
    .simpread-theme-root {
      background: #f8f8f8 url("") 0 0;
      color: #333
    }

    sr-rd-title {
      font-size: 56.32px;
      font-size: 3.52rem;
      line-height: 64px;
      line-height: 4rem;
      font-weight: 700;
      background: url(…sTAAALEwEAmpwYAAAAFUlEQVQIHWNIS0sr/v//PwMMDzY+ADqMahlW4J91AAAAAElFTkSuQmCC) 0 100% repeat-x
    }

    sr-rd-desc {
      font-style: italic;
      font-size: 30.72px;
      font-size: 1.92rem;
      line-height: 2;
      padding-left: 1em;
      border-left: 4px solid hsla(0, 0%, 67%, .5)
    }

    sr-rd-content {
      margin: 0 auto;
      padding: 1em 0
    }

    sr-rd-content,
    sr-rd-content *,
    sr-rd-content div,
    sr-rd-content p {
      line-height: 2;
      color: #333
    }

    sr-rd-content a,
    sr-rd-content a:link {
      color: #1863a1;
      text-decoration: underline
    }

    sr-rd-content a:active,
    sr-rd-content a:focus,
    sr-rd-content a:hover {
      color: #0181eb;
      text-decoration: underline
    }

    sr-rd-content pre {
      color: #586e75;
      background-color: #fdf6e3;
      border-radius: .4em;
      border: 1px solid #e7dec3
    }

    sr-rd-content li code,
    sr-rd-content p code {
      color: #555;
      background-color: transparent;
      border: 1px solid #ddd
    }

    sr-rd-mult {
      background-color: #ededed
    }
  </style>
  <style type="text/css">
    sr-rd-theme-pixyii {
      display: none
    }

    sr-rd-content h1,
    sr-rd-content h1 *,
    sr-rd-content h2,
    sr-rd-content h2 *,
    sr-rd-content h3,
    sr-rd-content h3 *,
    sr-rd-content h4,
    sr-rd-content h4 *,
    sr-rd-content h5,
    sr-rd-content h5 *,
    sr-rd-content h6,
    sr-rd-content h6 * {
      color: inherit;
      font-weight: 900;
      line-height: 1.2;
      margin: 1em 0
    }

    sr-rd-content h1,
    sr-rd-content h1 * {
      font-size: 62.72px;
      font-size: 3.92rem
    }

    sr-rd-content h2,
    sr-rd-content h2 * {
      font-size: 58.24px;
      font-size: 3.64rem
    }

    sr-rd-content h3,
    sr-rd-content h3 * {
      font-size: 36.4px;
      font-size: 2.275rem
    }

    sr-rd-content h4,
    sr-rd-content h4 * {
      font-size: 29.12px;
      font-size: 1.82rem
    }

    sr-rd-content h5,
    sr-rd-content h5 *,
    sr-rd-content h6,
    sr-rd-content h6 * {
      font-size: 25.168px;
      font-size: 1.573rem
    }

    sr-rd-content ol,
    sr-rd-content ul {
      font-size: 28px;
      font-size: 1.75rem;
      line-height: 24px;
      line-height: 1.5rem
    }

    sr-rd-content li {
      font-size: 25.2px;
      font-size: 1.575rem;
      line-height: 1.8;
      margin: 0;
      position: relative
    }

    sr-rd-content table {
      width: 100%;
      font-size: 25.2px;
      font-size: 1.575rem
    }

    sr-rd-content table>tbody>tr>td,
    sr-rd-content table>tbody>tr>th,
    sr-rd-content table>tfoot>tr>td,
    sr-rd-content table>tfoot>tr>th,
    sr-rd-content table>thead>tr>td,
    sr-rd-content table>thead>tr>th {
      padding: 12px;
      line-height: 1.2;
      vertical-align: top;
      border-top: 1px solid #333
    }

    sr-rd-content table>thead>tr>th {
      vertical-align: bottom;
      border-bottom: 2px solid #333
    }

    sr-rd-content table>caption+thead>tr:first-child>td,
    sr-rd-content table>caption+thead>tr:first-child>th,
    sr-rd-content table>colgroup+thead>tr:first-child>td,
    sr-rd-content table>colgroup+thead>tr:first-child>th,
    sr-rd-content table>thead:first-child>tr:first-child>td,
    sr-rd-content table>thead:first-child>tr:first-child>th {
      border-top: 0
    }

    sr-rd-content table>tbody+tbody {
      border-top: 2px solid #333
    }

    sr-rd-content sr-blockquote {
      margin: 16px 0;
      margin: 1rem 0;
      padding: 1.33em;
      font-style: italic;
      border-left: 5px solid #7a7a7a;
      color: #555
    }

    .simpread-theme-root {
      background-color: #fff;
      color: #555
    }

    sr-rd-title {
      font-family: PingFang SC, Hiragino Sans GB, Microsoft Yahei, WenQuanYi Micro Hei, sans-serif;
      font-size: 67.2px;
      font-size: 4.2rem;
      font-weight: 900;
      line-height: 1.2
    }

    sr-rd-desc {
      margin: 16px 0;
      margin: 1rem 0;
      padding: 1.33em;
      font-style: italic;
      font-size: 32px;
      font-size: 2rem;
      line-height: 2;
      border-left: 5px solid #7a7a7a;
      color: #555
    }

    sr-rd-content {
      font-size: 33.6px;
      font-size: 2.1rem;
      line-height: 1.8;
      font-weight: 400;
      color: #555
    }

    sr-rd-content *,
    sr-rd-content div,
    sr-rd-content p {
      color: #555;
      font-size: 28px;
      font-size: 1.75rem;
      line-height: 1.8;
      font-weight: 300
    }

    sr-rd-content b,
    sr-rd-content b *,
    sr-rd-content strong,
    sr-rd-content strong * {
      font-weight: 700
    }

    sr-rd-content a,
    sr-rd-content a:active,
    sr-rd-content a:focus,
    sr-rd-content a:hover,
    sr-rd-content a:link {
      color: #463f5c;
      text-decoration: underline
    }

    sr-rd-content sr-blockquote code {
      font-size: inherit
    }

    sr-rd-content pre {
      border: 1px solid #7a7a7a
    }

    sr-rd-content li code,
    sr-rd-content p code,
    sr-rd-content pre {
      color: #7a7a7a;
      background-color: transparent
    }

    .simpread-multi-root {
      background: #f8f9fa
    }
  </style>
  <style type="text/css">
    sr-rd-theme-monospace {
      display: none
    }

    sr-rd-content h1,
    sr-rd-content h2,
    sr-rd-content h3,
    sr-rd-content h4,
    sr-rd-content h5,
    sr-rd-content h6 {
      font-weight: 700;
      color: #6363ac
    }

    sr-rd-content h1 {
      font-size: 35.2px;
      font-size: 2.2rem
    }

    sr-rd-content h2 {
      font-size: 32px;
      font-size: 2rem
    }

    sr-rd-content h3 {
      font-size: 28.8px;
      font-size: 1.8rem
    }

    sr-rd-content h4 {
      font-size: 25.6px;
      font-size: 1.6rem
    }

    sr-rd-content h5 {
      font-size: 22.4px;
      font-size: 1.4rem
    }

    sr-rd-content h6 {
      font-size: 20.8px;
      font-size: 1.3rem
    }

    sr-rd-content strong {
      color: #b5302e
    }

    sr-rd-content em {
      font-style: italic;
      color: #400469
    }

    sr-rd-content ol,
    sr-rd-content ul {
      list-style-type: none
    }

    sr-rd-content ol li,
    sr-rd-content ul li {
      margin: 0
    }

    sr-rd-content table {
      line-height: 25.6px;
      line-height: 1.6rem;
      border-collapse: collapse;
      border-spacing: 0;
      empty-cells: show;
      border: 1px solid #cbcbcb
    }

    sr-rd-content thead {
      background-color: #e0e0e0;
      color: #000;
      text-align: left;
      vertical-align: bottom
    }

    sr-rd-content td,
    sr-rd-content th {
      border-left: 1px solid #cbcbcb;
      border-width: 0 0 0 1px;
      margin: 0;
      overflow: visible;
      padding: .5em 1em
    }

    sr-rd-content sr-blockquote {
      background-color: hsla(0, 0%, 50%, .05);
      border-top-right-radius: 5px;
      border-bottom-right-radius: 5px;
      border-left: 8px solid #979797;
      line-height: 2
    }

    sr-rd-content sr-blockquote * {
      line-height: inherit
    }

    .simpread-theme-root {
      color: #333;
      background: #fff
    }

    sr-rd-title {
      font-size: 44.8px;
      font-size: 2.8rem;
      line-height: 1.2;
      font-weight: 700;
      color: #6363ac
    }

    sr-rd-desc {
      padding: 10px;
      background-color: hsla(0, 0%, 50%, .05);
      font-size: 28.8px;
      font-size: 1.8rem;
      text-align: center;
      border-top-right-radius: 5px;
      border-bottom-right-radius: 5px;
      border-left: 8px solid #979797
    }

    sr-rd-content {
      color: #333
    }

    sr-rd-content,
    sr-rd-content *,
    sr-rd-content div,
    sr-rd-content p {
      line-height: 1.7
    }

    sr-rd-content a,
    sr-rd-content a:link {
      color: #005dad;
      text-decoration: underline
    }

    sr-rd-content a:active,
    sr-rd-content a:focus,
    sr-rd-content a:hover {
      color: #fff;
      background-color: #2a6496;
      text-decoration: none
    }

    sr-rd-content pre {
      color: #e9eded;
      background-color: #263238
    }

    sr-rd-content li code,
    sr-rd-content p code {
      color: #949415;
      background-color: transparent
    }

    .simpread-multi-root {
      background: #f8f9fa
    }
  </style>
  <style type="text/css">
    sr-rd-theme-night {
      display: none
    }

    sr-rd-content h1 {
      margin-top: 2em
    }

    sr-rd-content h1,
    sr-rd-content h2,
    sr-rd-content h3,
    sr-rd-content h4,
    sr-rd-content h5,
    sr-rd-content h6 {
      color: #dedede;
      font-weight: 400;
      clear: both;
      -ms-word-wrap: break-word;
      word-wrap: break-word;
      margin: 0;
      padding: 0
    }

    sr-rd-content h1 {
      font-size: 57.6px;
      font-size: 3.6rem;
      line-height: 64px;
      line-height: 4rem;
      margin-bottom: 38.4px;
      margin-bottom: 2.4rem;
      letter-spacing: -1.5px
    }

    sr-rd-content h2 {
      font-size: 38.4px;
      font-size: 2.4rem;
      line-height: 48px;
      line-height: 3rem
    }

    sr-rd-content h2,
    sr-rd-content h3 {
      margin-bottom: 38.4px;
      margin-bottom: 2.4rem;
      letter-spacing: -1px
    }

    sr-rd-content h3 {
      font-size: 28.8px;
      font-size: 1.8rem;
      line-height: 38.4px;
      line-height: 2.4rem
    }

    sr-rd-content h4 {
      font-size: 25.6px;
      font-size: 1.6rem;
      line-height: 35.2px;
      line-height: 2.2rem;
      margin-bottom: 38.4px;
      margin-bottom: 2.4rem
    }

    sr-rd-content h5 {
      font-size: 16px;
      font-size: 1rem;
      line-height: 20px;
      line-height: 1.25rem;
      margin-bottom: 24px;
      margin-bottom: 1.5rem
    }

    sr-rd-content h6 {
      font-size: 25.6px;
      font-size: 1.6rem;
      line-height: 25.6px;
      line-height: 1.6rem;
      margin-bottom: 12px;
      margin-bottom: .75rem;
      font-weight: 700
    }

    sr-rd-content ol,
    sr-rd-content ul {
      padding: 0 0 0 30px;
      padding: 0 0 0 1.875rem
    }

    sr-rd-content ul {
      list-style: square
    }

    sr-rd-content ol {
      list-style: decimal
    }

    sr-rd-content ol ol,
    sr-rd-content ol ul,
    sr-rd-content ul ol,
    sr-rd-content ul ul {
      margin: 0
    }

    sr-rd-content li div {
      padding-top: 0
    }

    sr-rd-content li,
    sr-rd-content li p {
      margin: 0;
      position: relative
    }

    sr-rd-content table {
      margin-top: 0;
      margin-bottom: 24px;
      margin-bottom: 1.5rem;
      border-collapse: collapse;
      border-spacing: 0;
      page-break-inside: auto;
      text-align: left
    }

    sr-rd-content table a {
      color: #dedede
    }

    sr-rd-content thead {
      display: table-header-group
    }

    sr-rd-content table td,
    sr-rd-content table th {
      border: 1px solid #474d54
    }

    sr-rd-content sr-blockquote {
      margin: 0 0 30px 30px;
      margin: 0 0 1.875rem 1.875rem;
      border-left: 2px solid #474d54;
      padding-left: 30px;
      margin-top: 35px;
      line-height: 2
    }

    .simpread-multi-root,
    .simpread-theme-root {
      background: #363b40;
      color: #b8bfc6
    }

    sr-rd-title {
      color: #dedede;
      font-size: 50.4px;
      font-size: 3.15rem;
      line-height: 56px;
      line-height: 3.5rem;
      letter-spacing: -1.5px
    }

    sr-rd-desc {
      margin: 35px;
      margin-left: 0;
      padding-left: 30px;
      padding-left: 1.875rem;
      font-size: 32px;
      font-size: 2rem;
      line-height: 2;
      border-left: 2px solid #474d54
    }

    sr-rd-content,
    sr-rd-desc {
      color: #b8bfc6
    }

    sr-rd-content *,
    sr-rd-content div,
    sr-rd-content p {
      color: #b8bfc6;
      margin-top: 0;
      line-height: 2
    }

    sr-rd-content a,
    sr-rd-content a:link {
      color: #e0e0e0;
      text-decoration: underline;
      -webkit-transition: all .2s ease-in-out;
      transition: all .2s ease-in-out
    }

    sr-rd-content a:active,
    sr-rd-content a:focus,
    sr-rd-content a:hover {
      color: #fff
    }

    sr-rd-content pre {
      background-color: transparent;
      border: 1px solid
    }

    sr-rd-content li code,
    sr-rd-content p code {
      background: rgba(0, 0, 0, .05)
    }

    sr-rd-mult {
      background-color: #2d3034
    }

    panel {
      background-color: #2e2e2e !important
    }

    panel panel-tab span {
      color: #fff
    }

    panel sr-opt-gp sr-opt-label {
      color: rgba(108, 255, 240, .8);
      font-weight: 400
    }

    panel text-field-float {
      color: rgba(108, 255, 240, .8) !important;
      font-weight: 400 !important
    }

    panel list-field {
      background-color: transparent !important
    }

    panel list-field:hover list-field-name {
      color: #fff !important;
      font-weight: 700
    }

    panel input,
    panel list-field-name {
      color: hsla(35, 10%, 76%, .87) !important
    }

    panel list-view {
      background-color: #2e2e2e !important
    }

    panel sr-opt-gp action-label,
    panel switch content * {
      color: #fff !important
    }

    panel-tabs {
      border-bottom-color: #393d40 !important
    }

    sr-annote {
      color: #333
    }

    sr-annote-sidebar * {
      color: hsla(36, 10%, 90%, .9) !important
    }

    sr-annote-sidebar-card[type=unread] {
      background-color: #19896e !important
    }

    sr-annote-sidebar-card:hover {
      box-shadow: 0 10px 20px 0 rgba(60, 73, 82, .6) !important
    }

    sr-annote-sidebar-note,
    sr-annote-sidebar-options,
    sr-annote-sidebar-toolbars {
      background-color: #282b2d !important
    }

    sr-rd-theme-night-comp {
      display: none;
      opacity: 0
    }

    dialog-content,
    dialog-footer {
      color: #b8bfc6 !important;
      background-color: #2e2e2e !important
    }

    dialog-content * {
      color: #b8bfc6 !important
    }

    dialog-content svg path {
      fill: #b8bfc6 !important
    }

    dialog-content button-text {
      color: #b8bfc6 !important
    }

    dialog-content text-field-state {
      border-top: none #b8bfc6 !important;
      border-left: none #b8bfc6 !important;
      border-right: none #b8bfc6 !important;
      border-bottom: 2px solid #b8bfc6 !important
    }

    dialog-footer button-text {
      color: #b8bfc6 !important
    }

    auto-complete list-view,
    dropdown list-view {
      color: #b8bfc6 !important;
      background-color: #2e2e2e !important
    }

    auto-complete list-field,
    dropdown list-field {
      -webkit-transition: all .45s cubic-bezier(.23, 1, .32, 1) 0ms;
      transition: all .45s cubic-bezier(.23, 1, .32, 1) 0ms
    }

    auto-complete list-field[active=true],
    dropdown list-field[active=true] {
      color: #b8bfc6 !important;
      background-color: #1b1b1b !important
    }

    auto-complete tag {
      background-color: #1b1b1b !important
    }

    sr-rd-theme-night-comp {
      display: none
    }
  </style>
  <style type="text/css">
    sr-rd-theme-dark {
      display: none
    }

    sr-rd-content h1,
    sr-rd-content h2,
    sr-rd-content h3,
    sr-rd-content h4,
    sr-rd-content h5,
    sr-rd-content h6 {
      font-weight: 700;
      color: #dbdbfd
    }

    sr-rd-content h1 {
      font-size: 48px;
      font-size: 3rem
    }

    sr-rd-content h2 {
      font-size: 44.8px;
      font-size: 2.8rem
    }

    sr-rd-content h3 {
      font-size: 40px;
      font-size: 2.5rem
    }

    sr-rd-content h4,
    sr-rd-content h5,
    sr-rd-content h6 {
      color: #549ad8
    }

    sr-rd-content h5 {
      font-size: 32px;
      font-size: 2rem
    }

    sr-rd-content h6 {
      font-size: 28.8px;
      font-size: 1.8rem
    }

    sr-rd-content strong {
      color: #ffffc5
    }

    sr-rd-content em {
      color: #c885f5
    }

    sr-rd-content table {
      width: 100%;
      line-height: 25.6px;
      line-height: 1.6rem;
      border-collapse: collapse;
      border-spacing: 0;
      empty-cells: show;
      border: 1px solid #cbcbcb
    }

    sr-rd-content thead {
      background-color: #263238;
      color: #f5f5f5;
      text-align: left;
      vertical-align: bottom
    }

    sr-rd-content table td,
    sr-rd-content table th {
      border-left: 1px solid #cbcbcb;
      border-width: 0 0 0 1px;
      margin: 0;
      overflow: visible;
      padding: .5em 1em
    }

    sr-rd-content sr-blockquote {
      background-color: hsla(0, 0%, 50%, .05);
      border-top-right-radius: 5px;
      border-bottom-right-radius: 5px;
      border-left: 8px solid #979797;
      color: #ebebeb
    }

    .simpread-multi-root,
    .simpread-theme-root {
      color: #ebebeb;
      background: #222
    }

    sr-rd-title {
      padding-bottom: .3em;
      font-size: 44.8px;
      font-size: 2.8rem;
      font-weight: 700;
      line-height: 1.2;
      color: #dbdbfd;
      border-bottom: 1px solid #eee
    }

    sr-rd-desc {
      margin: 20px;
      margin-left: 0;
      padding: 5px 20px;
      font-size: 28.8px;
      font-size: 1.8rem;
      background-color: hsla(0, 0%, 50%, .05);
      color: #ebebeb;
      border-top-right-radius: 5px;
      border-bottom-right-radius: 5px;
      border-left: 8px solid #979797
    }

    sr-rd-content,
    sr-rd-content *,
    sr-rd-content div,
    sr-rd-content p {
      line-height: 1.7;
      color: #ebebeb
    }

    sr-rd-content a,
    sr-rd-content a:link {
      color: #8ac9ff;
      text-decoration: underline
    }

    sr-rd-content a:active,
    sr-rd-content a:focus,
    sr-rd-content a:hover {
      background-color: #2a6496;
      color: #fff;
      text-decoration: none
    }

    sr-rd-content pre {
      color: #e9eded;
      background-color: #263238
    }

    sr-rd-content li code,
    sr-rd-content p code {
      color: #caca16;
      background-color: transparent
    }

    sr-rd-mult {
      background-color: hsla(0, 0%, 50%, .1)
    }

    panel {
      background-color: #222 !important
    }

    panel panel-tab span {
      color: #fff
    }

    panel sr-opt-gp sr-opt-label {
      color: rgba(108, 255, 240, .8);
      font-weight: 400
    }

    panel text-field-float {
      color: rgba(108, 255, 240, .8) !important;
      font-weight: 400 !important
    }

    panel list-field {
      background-color: transparent !important
    }

    panel list-field:hover list-field-name {
      color: #fff !important;
      font-weight: 700
    }

    panel input,
    panel list-field-name {
      color: hsla(35, 10%, 76%, .87) !important
    }

    panel list-view {
      background-color: #222 !important
    }

    panel text-field input {
      color: rgba(108, 255, 240, .8) !important
    }

    panel sr-opt-gp action-label,
    panel switch content * {
      color: #fff !important
    }

    panel-tabs {
      border-bottom-color: #393d40 !important
    }

    sr-annote {
      color: #333
    }

    sr-annote-sidebar * {
      color: hsla(36, 10%, 90%, .9) !important
    }

    sr-annote-sidebar-card[type=unread] {
      background-color: #19896e !important
    }

    sr-annote-sidebar-card:hover {
      box-shadow: 0 10px 20px 0 rgba(60, 73, 82, .6) !important
    }

    sr-annote-sidebar-note,
    sr-annote-sidebar-options,
    sr-annote-sidebar-toolbars {
      background-color: #2a2a2a !important
    }

    sr-rd-theme-dark-comp {
      display: none;
      opacity: 0
    }

    dialog-content,
    dialog-footer {
      color: #dbdbfd !important;
      background-color: #222 !important
    }

    dialog-content * {
      color: #dbdbfd !important
    }

    dialog-content svg path {
      fill: #dbdbfd !important
    }

    dialog-content button-text {
      color: #dbdbfd !important
    }

    dialog-content text-field-state {
      border-top: none #dbdbfd !important;
      border-left: none #dbdbfd !important;
      border-right: none #dbdbfd !important;
      border-bottom: 2px solid #dbdbfd !important
    }

    dialog-footer button-text {
      color: #dbdbfd !important
    }

    auto-complete list-view,
    dropdown list-view {
      color: #dbdbfd !important;
      background-color: #222 !important
    }

    auto-complete list-field,
    dropdown list-field {
      -webkit-transition: all .45s cubic-bezier(.23, 1, .32, 1) 0ms;
      transition: all .45s cubic-bezier(.23, 1, .32, 1) 0ms
    }

    auto-complete list-field[active=true],
    dropdown list-field[active=true] {
      color: #dbdbfd !important;
      background-color: #1b1b1b !important
    }

    auto-complete tag {
      background-color: #1b1b1b !important
    }

    sr-rd-theme-dark-comp {
      display: none
    }
  </style>
  <style type="text/css">
    sr-rd-theme-mail {
      display: none
    }

    sr-rd-content h1,
    sr-rd-content h2,
    sr-rd-content h3,
    sr-rd-content h4,
    sr-rd-content h5,
    sr-rd-content h6 {
      position: relative;
      margin-top: 1em;
      margin-bottom: 1pc;
      font-weight: 700;
      line-height: 1.4;
      text-align: left;
      color: #363636
    }

    sr-rd-content h1 {
      padding-bottom: .3em;
      font-size: 36p;
      line-height: 1.2
    }

    sr-rd-content h2 {
      padding-bottom: .3em;
      font-size: 28p;
      line-height: 1.225
    }

    sr-rd-content h3 {
      font-size: 24p;
      line-height: 1.43
    }

    sr-rd-content h4 {
      font-size: 2p
    }

    sr-rd-content h5 {
      font-size: 16px
    }

    sr-rd-content h6 {
      font-size: 16px;
      color: #777
    }

    sr-rd-content ol,
    sr-rd-content ul {
      list-style-type: disc;
      padding: 0;
      padding-left: 2em
    }

    sr-rd-content ol ol,
    sr-rd-content ul ol {
      list-style-type: lower-roman
    }

    sr-rd-content ol ol ol,
    sr-rd-content ol ul ol,
    sr-rd-content ul ol ol,
    sr-rd-content ul ul ol {
      list-style-type: lower-alpha
    }

    sr-rd-content table {
      width: 100%;
      overflow: auto;
      word-break: normal;
      word-break: keep-all
    }

    sr-rd-content table th {
      font-weight: 700
    }

    sr-rd-content table td,
    sr-rd-content table th {
      padding: 6px 13px;
      border: 1px solid #ddd
    }

    sr-rd-content table tr {
      background-color: #fff;
      border-top: 1px solid #ccc
    }

    sr-rd-content table tr:nth-child(2n) {
      background-color: #f8f8f8
    }

    sr-rd-content sr-blockquote {
      border-left: 4px solid #ddd
    }

    .simpread-theme-root {
      background-color: #fff;
      color: #333
    }

    .sr-header {
      display: -webkit-inline-box;
      display: -ms-inline-flexbox;
      display: inline-flex;
      -webkit-box-pack: left;
      -ms-flex-pack: left;
      justify-content: left;
      width: 100%;
      margin: 10px 0;
      height: 41px;
      border-bottom: 1px solid #e0e0e0;
      padding-bottom: 10px
    }

    .sr-header,
    .sr-header a {
      -webkit-box-orient: horizontal;
      -webkit-box-direction: normal;
      -ms-flex-direction: row;
      flex-direction: row;
      -webkit-box-align: center;
      -ms-flex-align: center;
      align-items: center;
      color: #195bf7
    }

    .sr-header a {
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      text-decoration: none
    }

    .sr-header .sr-name {
      height: 41px;
      line-height: 41px;
      font-size: 20px;
      font-weight: 700;
      text-decoration: none
    }

    .sr-header .sr-logo {
      display: block;
      width: 41px;
      height: 41px;
      background-repeat: no-repeat;
      background-position: 50%;
      background-image: url(https://simpread-1254315611.file.myqcloud.com/favicon/favicon-32x32.png);
      margin-right: 5px
    }

    .sr-header .sr-slogan {
      height: 41px;
      line-height: 44px;
      font-weight: 700;
      font-size: 15px
    }

    .sr-rd-footer {
      font-size: 14px;
      text-align: center;
      color: #363636
    }

    .sr-rd-footer-group {
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      height: 20px
    }

    .sr-rd-footer-line {
      width: 100%;
      border-top: 1px solid #e0e0e0
    }

    .sr-rd-footer-text {
      min-width: 150px;
      line-height: 0;
      text-align: center
    }

    .sr-rd-footer-copywrite {
      margin: 10px 0 0;
      color: #363636
    }

    .sr-rd-footer-copywrite abbr {
      -webkit-font-feature-settings: normal;
      font-feature-settings: normal;
      font-variant: normal;
      text-decoration: none
    }

    .sr-rd-footer-copywrite .second {
      margin: 10px 0
    }

    .sr-rd-footer-copywrite .third a:hover {
      border: none !important
    }

    .sr-rd-footer-copywrite .third a:first-child {
      margin-right: 50px
    }

    .sr-rd-footer-copywrite .sr-icon {
      display: -webkit-inline-box;
      display: -ms-inline-flexbox;
      display: inline-flex;
      -webkit-box-pack: center;
      -ms-flex-pack: center;
      justify-content: center;
      -webkit-box-align: center;
      -ms-flex-align: center;
      align-items: center;
      width: 33px;
      height: 33px;
      opacity: .8;
      -webkit-transition: opacity .5s ease;
      transition: opacity .5s ease;
      cursor: pointer
    }

    .sr-rd-footer-copywrite .sr-icon:hover {
      opacity: 1
    }

    .sr-rd-footer-copywrite a,
    .sr-rd-footer-copywrite a:link,
    .sr-rd-footer-copywrite a:visited {
      margin: 0;
      padding: 0;
      color: inherit;
      background-color: transparent;
      font-size: inherit !important;
      line-height: normal;
      text-decoration: none;
      vertical-align: baseline;
      vertical-align: initial;
      border: none !important;
      box-sizing: border-box
    }

    .sr-rd-footer-copywrite a:focus,
    .sr-rd-footer-copywrite a:hover,
    .sr-rd-footer a:active {
      color: inherit;
      text-decoration: none;
      border-bottom: 1px dotted !important
    }

    .sr-rd-content-desc {
      margin: 0;
      padding: 0 0 0 1em;
      color: #363636;
      line-height: 2;
      font-size: 18px;
      border-left: 4px solid hsla(0, 0%, 67%, .5)
    }

    sr-rd-content {
      font-size: 16px;
      line-height: 1.6
    }

    sr-rd-content h1,
    sr-rd-content h1 *,
    sr-rd-content h2,
    sr-rd-content h2 *,
    sr-rd-content h3,
    sr-rd-content h3 *,
    sr-rd-content h4,
    sr-rd-content h4 *,
    sr-rd-content h5,
    sr-rd-content h5 *,
    sr-rd-content h6,
    sr-rd-content h6 * {
      word-break: break-all
    }

    sr-rd-content div,
    sr-rd-content p {
      display: block;
      float: inherit;
      line-height: 1.6;
      font-size: 16px
    }

    sr-rd-content,
    sr-rd-content *,
    sr-rd-content div,
    sr-rd-content p {
      color: #363636;
      font-weight: 400;
      line-height: 1.8
    }

    sr-rd-content strong,
    sr-rd-content strong * {
      -webkit-animation: none 0s ease 0s 1 normal none running;
      animation: none 0s ease 0s 1 normal none running;
      -webkit-backface-visibility: visible;
      backface-visibility: visible;
      background: transparent none repeat 0 0/auto auto padding-box border-box scroll;
      border: medium none currentColor;
      border-collapse: separate;
      -o-border-image: none;
      border-image: none;
      border-radius: 0;
      border-spacing: 0;
      bottom: auto;
      box-shadow: none;
      box-sizing: content-box;
      caption-side: top;
      clear: none;
      clip: auto;
      color: #000;
      -webkit-columns: auto;
      -moz-columns: auto;
      columns: auto;
      -webkit-column-count: auto;
      -moz-column-count: auto;
      column-count: auto;
      -webkit-column-fill: balance;
      -moz-column-fill: balance;
      column-fill: balance;
      -webkit-column-gap: normal;
      -moz-column-gap: normal;
      column-gap: normal;
      -webkit-column-rule: medium none currentColor;
      -moz-column-rule: medium none currentColor;
      column-rule: medium none currentColor;
      -webkit-column-span: 1;
      -moz-column-span: 1;
      column-span: 1;
      -webkit-column-width: auto;
      -moz-column-width: auto;
      column-width: auto;
      content: normal;
      counter-increment: none;
      counter-reset: none;
      cursor: auto;
      direction: ltr;
      display: inline;
      empty-cells: show;
      float: none;
      font-family: serif;
      font-size: medium;
      font-style: normal;
      font-variant: normal;
      font-weight: 400;
      font-stretch: normal;
      line-height: normal;
      height: auto;
      -webkit-hyphens: none;
      -ms-hyphens: none;
      hyphens: none;
      left: auto;
      letter-spacing: normal;
      list-style: disc outside none;
      margin: 0;
      max-height: none;
      max-width: none;
      min-height: 0;
      min-width: 0;
      opacity: 1;
      orphans: 2;
      outline: medium none invert;
      overflow: visible;
      overflow-x: visible;
      overflow-y: visible;
      padding: 0;
      page-break-after: auto;
      page-break-before: auto;
      page-break-inside: auto;
      -webkit-perspective: none;
      perspective: none;
      -webkit-perspective-origin: 50% 50%;
      perspective-origin: 50% 50%;
      position: static;
      right: auto;
      -moz-tab-size: 8;
      -o-tab-size: 8;
      tab-size: 8;
      table-layout: auto;
      text-align: left;
      text-align-last: auto;
      text-decoration: none;
      text-indent: 0;
      text-shadow: none;
      text-transform: none;
      top: auto;
      -webkit-transform: none;
      transform: none;
      -webkit-transform-origin: 50% 50% 0;
      transform-origin: 50% 50% 0;
      -webkit-transform-style: flat;
      transform-style: flat;
      -webkit-transition: none 0s ease 0s;
      transition: none 0s ease 0s;
      unicode-bidi: normal;
      vertical-align: baseline;
      visibility: visible;
      white-space: normal;
      widows: 2;
      width: auto;
      word-spacing: normal;
      z-index: auto;
      all: initial
    }

    sr-rd-content a,
    sr-rd-content a:link {
      color: #4183c4;
      text-decoration: none
    }

    sr-rd-content a:active,
    sr-rd-content a:focus,
    sr-rd-content a:hover {
      color: #4183c4;
      text-decoration: underline
    }

    sr-rd-content figure {
      margin: 0;
      padding: 0
    }

    sr-rd-content img {
      display: inline-block;
      padding: 0;
      height: auto;
      line-height: 100%;
      max-width: 50%;
      text-decoration: none;
      vertical-align: text-bottom;
      border-radius: 10px;
      outline: none
    }

    sr-rd-content pre {
      background-color: #f7f7f7;
      border-radius: 3px
    }

    sr-rd-content pre * {
      font-size: 1.1px
    }

    sr-rd-content li code,
    sr-rd-content p code {
      background-color: rgba(0, 0, 0, .04);
      border-radius: 3px
    }

    .simpread-multi-root {
      background: #f8f9fa
    }

    .sr-rd-mult {
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-orient: horizontal;
      -webkit-box-direction: normal;
      -ms-flex-direction: row;
      flex-direction: row;
      margin: 0 0 16px;
      padding: 16px 0 24px;
      width: 100%;
      background-color: #fff;
      border-bottom: 1px solid #e0e0e0
    }

    .sr-rd-mult .sr-rd-mult-content {
      padding: 0 16px;
      overflow: auto
    }

    .sr-rd-mult .sr-rd-mult-avatar {
      margin: 0 15px
    }

    .sr-rd-mult .sr-rd-mult-avatar span {
      display: -webkit-box;
      -webkit-line-clamp: 1;
      -webkit-box-orient: vertical;
      max-width: 75px;
      overflow: hidden;
      text-overflow: ellipsis;
      text-align: left;
      font-size: 16px;
      font-size: 1rem
    }

    .sr-rd-mult .sr-rd-mult-avatar img {
      margin-bottom: 0;
      max-width: 50px;
      max-height: 50px;
      width: 50px;
      height: 50px;
      border-radius: 50%
    }

    .sr-rd-mult .sr-rd-mult-avatar .sr-rd-content-center {
      margin: 0
    }

    sr-rd-content.embed * {
      font-size: medium
    }

    sr-rd-content.embed img {
      max-width: 100%
    }

    sr-rd-content.embed a,
    sr-rd-content.embed a:hover {
      color: inherit;
      font-size: medium
    }

    sr-rd-content.embed a:hover {
      background-color: inherit
    }

    sr-rd-content.embed .MathJax_Processed,
    sr-rd-content.embed math {
      display: none
    }

    sr-rd-content.embed pre {
      color: #000;
      color: initial;
      background-color: transparent
    }

    sr-rd-content.embed pre,
    sr-rd-content.embed pre * {
      font-size: 13px !important
    }
  </style>
  <style type="text/css">
    @media (pointer:coarse) {
      sr-read {
        margin: 20px 5% !important;
        min-width: 0 !important;
        max-width: 90% !important
      }

      sr-rd-title {
        margin-top: 0;
        font-size: 2.7rem
      }

      sr-rd-content sr-blockquote,
      sr-rd-desc {
        margin: 10 0 !important;
        padding: 0 0 0 10px !important;
        width: 90%;
        font-size: 1.8rem;
        font-style: normal;
        line-height: 1.7;
        text-align: justify
      }

      sr-rd-content {
        font-size: 1.75rem;
        font-weight: 300
      }

      sr-rd-content figure {
        margin: 0;
        padding: 0;
        text-align: center
      }

      sr-rd-content a,
      sr-rd-content a:link,
      sr-rd-content li code,
      sr-rd-content p code {
        font-size: inherit
      }

      sr-rd-footer {
        margin-top: 20px
      }

      sr-blockquote,
      sr-blockquote * {
        margin: 5px !important;
        padding: 5px !important
      }

      sr-rd-content h1,
      sr-rd-content h2,
      sr-rd-content h3,
      sr-rd-content h4,
      sr-rd-content h5,
      sr-rd-content h6,
      sr-rd-title {
        font-family: PingFang SC, Verdana, Helvetica Neue, Microsoft Yahei, Hiragino Sans GB, Microsoft Sans Serif, WenQuanYi Micro Hei, sans-serif;
        color: #000;
        font-weight: 100;
        line-height: 1.35
      }

      sr-rd-content-h1,
      sr-rd-content-h2,
      sr-rd-content-h3,
      sr-rd-content-h4,
      sr-rd-content-h5,
      sr-rd-content-h6,
      sr-rd-content h1,
      sr-rd-content h2,
      sr-rd-content h3,
      sr-rd-content h4,
      sr-rd-content h5,
      sr-rd-content h6 {
        margin-top: 1.2em;
        margin-bottom: .6em;
        line-height: 1.35
      }

      sr-rd-content-h1,
      sr-rd-content h1 {
        font-size: 1.8em
      }

      sr-rd-content-h2,
      sr-rd-content h2 {
        font-size: 1.6em
      }

      sr-rd-content-h3,
      sr-rd-content h3 {
        font-size: 1.4em
      }

      sr-rd-content-h4,
      sr-rd-content-h5,
      sr-rd-content-h6,
      sr-rd-content h4,
      sr-rd-content h5,
      sr-rd-content h6 {
        font-size: 1.2em
      }

      sr-rd-content-ul,
      sr-rd-content ul {
        margin-left: 1.3em !important;
        list-style: disc
      }

      sr-rd-content-ol,
      sr-rd-content ol {
        list-style: decimal;
        margin-left: 1.9em !important
      }

      sr-rd-content-ol ol,
      sr-rd-content-ol ul,
      sr-rd-content-ul ol,
      sr-rd-content-ul ul,
      sr-rd-content li ol,
      sr-rd-content li ul {
        margin-bottom: .8em;
        margin-left: 2em !important
      }

      sr-rd-content img {
        margin: 0;
        padding: 0;
        border: 0;
        max-width: 100% !important;
        height: auto;
        box-shadow: 0 20px 20px -10px rgba(0, 0, 0, .1)
      }

      sr-rd-mult {
        min-width: 0;
        background-color: #fff;
        box-shadow: 0 1px 6px rgba(32, 33, 36, .28);
        border-radius: 8px
      }

      sr-rd-mult sr-rd-mult-avatar div {
        margin: 0
      }

      sr-rd-mult sr-rd-mult-avatar .sr-rd-content-center-small {
        margin: 7px 0 !important
      }

      sr-rd-mult sr-rd-mult-avatar span {
        display: block
      }

      sr-rd-mult sr-rd-mult-content {
        padding-left: 0
      }

      @media only screen and (max-device-width:1024px) {

        .simpread-theme-root,
        html.simpread-theme-root {
          font-size: 80% !important
        }

        sr-rd-mult sr-rd-mult-avatar img {
          width: 50px;
          height: 50px;
          min-width: 50px;
          min-height: 50px
        }

        toc-bg toc {
          width: 10px !important
        }

        toc-bg:hover toc {
          width: auto !important
        }
      }

      @media only screen and (max-device-width:414px) {

        .simpread-theme-root,
        html.simpread-theme-root {
          font-size: 70% !important
        }

        sr-rd-mult sr-rd-mult-avatar img {
          width: 30px;
          height: 30px;
          min-width: 30px;
          min-height: 30px
        }
      }

      @media only screen and (max-device-width:320px) {

        .simpread-theme-root,
        html.simpread-theme-root {
          font-size: 90% !important
        }

        sr-rd-content p {
          margin-bottom: .5em
        }
      }
    }
  </style>
  <style type="text/css">
    button[aria-label][data-balloon-pos] {
      overflow: visible
    }

    [aria-label][data-balloon-pos] {
      position: relative;
      cursor: pointer
    }

    [aria-label][data-balloon-pos]:after {
      text-indent: 0;
      font-family: -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Oxygen, Ubuntu, Cantarell, Open Sans, Helvetica Neue, sans-serif;
      font-weight: 400;
      font-style: normal;
      text-shadow: none;
      font-size: 12px;
      background: hsla(0, 0%, 6%, .95);
      border-radius: 2px;
      color: #fff;
      content: attr(aria-label);
      padding: .5em 1em;
      white-space: nowrap
    }

    [aria-label][data-balloon-pos]:after,
    [aria-label][data-balloon-pos]:before {
      opacity: 0;
      pointer-events: none;
      -webkit-transition: all .18s ease-out .18s;
      transition: all .18s ease-out .18s;
      position: absolute;
      z-index: 10
    }

    [aria-label][data-balloon-pos]:before {
      width: 0;
      height: 0;
      border: 5px solid transparent;
      border-top-color: hsla(0, 0%, 6%, .95);
      content: ""
    }

    [aria-label][data-balloon-pos]:hover:after,
    [aria-label][data-balloon-pos]:hover:before,
    [aria-label][data-balloon-pos]:not([data-balloon-nofocus]):focus:after,
    [aria-label][data-balloon-pos]:not([data-balloon-nofocus]):focus:before,
    [aria-label][data-balloon-pos][data-balloon-visible]:after,
    [aria-label][data-balloon-pos][data-balloon-visible]:before {
      opacity: 1;
      pointer-events: none
    }

    [aria-label][data-balloon-pos].font-awesome:after {
      font-family: FontAwesome, -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Oxygen, Ubuntu, Cantarell, Open Sans, Helvetica Neue, sans-serif
    }

    [aria-label][data-balloon-pos][data-balloon-break]:after {
      white-space: pre
    }

    [aria-label][data-balloon-pos][data-balloon-break][data-balloon-length]:after {
      white-space: pre-line;
      word-break: break-word
    }

    [aria-label][data-balloon-pos][data-balloon-blunt]:after,
    [aria-label][data-balloon-pos][data-balloon-blunt]:before {
      -webkit-transition: none;
      transition: none
    }

    [aria-label][data-balloon-pos][data-balloon-pos=up]:after {
      margin-bottom: 10px
    }

    [aria-label][data-balloon-pos][data-balloon-pos=up]:after,
    [aria-label][data-balloon-pos][data-balloon-pos=up]:before {
      bottom: 100%;
      left: 50%;
      -webkit-transform: translate(-50%, 4px);
      transform: translate(-50%, 4px);
      -webkit-transform-origin: top;
      transform-origin: top
    }

    [aria-label][data-balloon-pos][data-balloon-pos=up]:hover:after,
    [aria-label][data-balloon-pos][data-balloon-pos=up]:hover:before,
    [aria-label][data-balloon-pos][data-balloon-pos=up][data-balloon-visible]:after,
    [aria-label][data-balloon-pos][data-balloon-pos=up][data-balloon-visible]:before {
      -webkit-transform: translate(-50%);
      transform: translate(-50%)
    }

    [aria-label][data-balloon-pos][data-balloon-pos=up-left]:after {
      bottom: 100%;
      left: 0;
      margin-bottom: 10px;
      -webkit-transform: translateY(4px);
      transform: translateY(4px);
      -webkit-transform-origin: top;
      transform-origin: top
    }

    [aria-label][data-balloon-pos][data-balloon-pos=up-left]:before {
      bottom: 100%;
      left: 5px;
      -webkit-transform: translateY(4px);
      transform: translateY(4px);
      -webkit-transform-origin: top;
      transform-origin: top
    }

    [aria-label][data-balloon-pos][data-balloon-pos=up-left]:hover:after,
    [aria-label][data-balloon-pos][data-balloon-pos=up-left]:hover:before,
    [aria-label][data-balloon-pos][data-balloon-pos=up-left][data-balloon-visible]:after,
    [aria-label][data-balloon-pos][data-balloon-pos=up-left][data-balloon-visible]:before {
      -webkit-transform: translate(0);
      transform: translate(0)
    }

    [aria-label][data-balloon-pos][data-balloon-pos=up-right]:after {
      bottom: 100%;
      right: 0;
      margin-bottom: 10px;
      -webkit-transform: translateY(4px);
      transform: translateY(4px);
      -webkit-transform-origin: top;
      transform-origin: top
    }

    [aria-label][data-balloon-pos][data-balloon-pos=up-right]:before {
      bottom: 100%;
      right: 5px;
      -webkit-transform: translateY(4px);
      transform: translateY(4px);
      -webkit-transform-origin: top;
      transform-origin: top
    }

    [aria-label][data-balloon-pos][data-balloon-pos=up-right]:hover:after,
    [aria-label][data-balloon-pos][data-balloon-pos=up-right]:hover:before,
    [aria-label][data-balloon-pos][data-balloon-pos=up-right][data-balloon-visible]:after,
    [aria-label][data-balloon-pos][data-balloon-pos=up-right][data-balloon-visible]:before {
      -webkit-transform: translate(0);
      transform: translate(0)
    }

    [aria-label][data-balloon-pos][data-balloon-pos=down]:after {
      left: 50%;
      margin-top: 10px;
      top: 100%;
      -webkit-transform: translate(-50%, -4px);
      transform: translate(-50%, -4px)
    }

    [aria-label][data-balloon-pos][data-balloon-pos=down]:before {
      width: 0;
      height: 0;
      border: 5px solid transparent;
      border-bottom-color: hsla(0, 0%, 6%, .95);
      left: 50%;
      top: 100%;
      -webkit-transform: translate(-50%, -4px);
      transform: translate(-50%, -4px)
    }

    [aria-label][data-balloon-pos][data-balloon-pos=down]:hover:after,
    [aria-label][data-balloon-pos][data-balloon-pos=down]:hover:before,
    [aria-label][data-balloon-pos][data-balloon-pos=down][data-balloon-visible]:after,
    [aria-label][data-balloon-pos][data-balloon-pos=down][data-balloon-visible]:before {
      -webkit-transform: translate(-50%);
      transform: translate(-50%)
    }

    [aria-label][data-balloon-pos][data-balloon-pos=down-left]:after {
      left: 0;
      margin-top: 10px;
      top: 100%;
      -webkit-transform: translateY(-4px);
      transform: translateY(-4px)
    }

    [aria-label][data-balloon-pos][data-balloon-pos=down-left]:before {
      width: 0;
      height: 0;
      border: 5px solid transparent;
      border-bottom-color: hsla(0, 0%, 6%, .95);
      left: 5px;
      top: 100%;
      -webkit-transform: translateY(-4px);
      transform: translateY(-4px)
    }

    [aria-label][data-balloon-pos][data-balloon-pos=down-left]:hover:after,
    [aria-label][data-balloon-pos][data-balloon-pos=down-left]:hover:before,
    [aria-label][data-balloon-pos][data-balloon-pos=down-left][data-balloon-visible]:after,
    [aria-label][data-balloon-pos][data-balloon-pos=down-left][data-balloon-visible]:before {
      -webkit-transform: translate(0);
      transform: translate(0)
    }

    [aria-label][data-balloon-pos][data-balloon-pos=down-right]:after {
      right: 0;
      margin-top: 10px;
      top: 100%;
      -webkit-transform: translateY(-4px);
      transform: translateY(-4px)
    }

    [aria-label][data-balloon-pos][data-balloon-pos=down-right]:before {
      width: 0;
      height: 0;
      border: 5px solid transparent;
      border-bottom-color: hsla(0, 0%, 6%, .95);
      right: 5px;
      top: 100%;
      -webkit-transform: translateY(-4px);
      transform: translateY(-4px)
    }

    [aria-label][data-balloon-pos][data-balloon-pos=down-right]:hover:after,
    [aria-label][data-balloon-pos][data-balloon-pos=down-right]:hover:before,
    [aria-label][data-balloon-pos][data-balloon-pos=down-right][data-balloon-visible]:after,
    [aria-label][data-balloon-pos][data-balloon-pos=down-right][data-balloon-visible]:before {
      -webkit-transform: translate(0);
      transform: translate(0)
    }

    [aria-label][data-balloon-pos][data-balloon-pos=left]:after {
      margin-right: 10px;
      right: 100%;
      top: 50%;
      -webkit-transform: translate(4px, -50%);
      transform: translate(4px, -50%)
    }

    [aria-label][data-balloon-pos][data-balloon-pos=left]:before {
      width: 0;
      height: 0;
      border: 5px solid transparent;
      border-left-color: hsla(0, 0%, 6%, .95);
      right: 100%;
      top: 50%;
      -webkit-transform: translate(4px, -50%);
      transform: translate(4px, -50%)
    }

    [aria-label][data-balloon-pos][data-balloon-pos=left]:hover:after,
    [aria-label][data-balloon-pos][data-balloon-pos=left]:hover:before,
    [aria-label][data-balloon-pos][data-balloon-pos=left][data-balloon-visible]:after,
    [aria-label][data-balloon-pos][data-balloon-pos=left][data-balloon-visible]:before {
      -webkit-transform: translateY(-50%);
      transform: translateY(-50%)
    }

    [aria-label][data-balloon-pos][data-balloon-pos=right]:after {
      left: 100%;
      margin-left: 10px;
      top: 50%;
      -webkit-transform: translate(-4px, -50%);
      transform: translate(-4px, -50%)
    }

    [aria-label][data-balloon-pos][data-balloon-pos=right]:before {
      width: 0;
      height: 0;
      border: 5px solid transparent;
      border-right-color: hsla(0, 0%, 6%, .95);
      left: 100%;
      top: 50%;
      -webkit-transform: translate(-4px, -50%);
      transform: translate(-4px, -50%)
    }

    [aria-label][data-balloon-pos][data-balloon-pos=right]:hover:after,
    [aria-label][data-balloon-pos][data-balloon-pos=right]:hover:before,
    [aria-label][data-balloon-pos][data-balloon-pos=right][data-balloon-visible]:after,
    [aria-label][data-balloon-pos][data-balloon-pos=right][data-balloon-visible]:before {
      -webkit-transform: translateY(-50%);
      transform: translateY(-50%)
    }

    [aria-label][data-balloon-pos][data-balloon-length=small]:after {
      white-space: normal;
      width: 80px
    }

    [aria-label][data-balloon-pos][data-balloon-length=medium]:after {
      white-space: normal;
      width: 150px
    }

    [aria-label][data-balloon-pos][data-balloon-length=large]:after {
      white-space: normal;
      width: 260px
    }

    [aria-label][data-balloon-pos][data-balloon-length=xlarge]:after {
      white-space: normal;
      width: 380px
    }

    @media screen and (max-width:768px) {
      [aria-label][data-balloon-pos][data-balloon-length=xlarge]:after {
        white-space: normal;
        width: 90vw
      }
    }

    [aria-label][data-balloon-pos]:before {
      display: none
    }

    [aria-label][data-balloon-pos]:after {
      box-shadow: 0 0 10px rgba(0, 0, 0, .3);
      border-radius: 5px;
      font-weight: 700;
      font-size: 10px
    }

    [aria-label][data-balloon-pos][data-balloon-pos=up]:after {
      line-height: 21px
    }

    [aria-label][data-balloon-pos][data-balloon-order=downleft]:after {
      left: 120%
    }

    [aria-label][data-balloon-pos][data-balloon-order=downright]:after {
      right: -22px
    }

    [aria-label][data-balloon-pos][data-balloon-order=upright]:after {
      left: 10%
    }
  </style>
  <style type="text/css">
    /*!
 * Waves v0.7.5
 * http://fian.my.id/Waves
 * 
 * Copyright 2014-2016 Alfiana E. Sibuea and other contributors
 * Released under the MIT license
 * https://github.com/fians/Waves/blob/master/LICENSE
 */
    .md-waves-effect {
      position: relative;
      cursor: pointer;
      display: inline-block;
      overflow: hidden;
      -webkit-user-select: none;
      -moz-user-select: none;
      -ms-user-select: none;
      user-select: none;
      -webkit-tap-highlight-color: transparent
    }

    .md-waves-effect .md-waves-ripple {
      position: absolute;
      border-radius: 50%;
      width: 100px;
      height: 100px;
      margin-top: -50px;
      margin-left: -50px;
      opacity: 0;
      background: rgba(0, 0, 0, .2);
      background: -webkit-radial-gradient(rgba(0, 0, 0, .2) 0, rgba(0, 0, 0, .3) 40%, rgba(0, 0, 0, .4) 50%, rgba(0, 0, 0, .5) 60%, hsla(0, 0%, 100%, 0) 70%);
      background: radial-gradient(rgba(0, 0, 0, .2) 0, rgba(0, 0, 0, .3) 40%, rgba(0, 0, 0, .4) 50%, rgba(0, 0, 0, .5) 60%, hsla(0, 0%, 100%, 0) 70%);
      -webkit-transition: all .5s ease-out;
      transition: all .5s ease-out;
      -webkit-transition-property: -webkit-transform, opacity;
      -webkit-transition-property: opacity, -webkit-transform;
      transition-property: opacity, -webkit-transform;
      transition-property: transform, opacity;
      transition-property: transform, opacity, -webkit-transform;
      -webkit-transform: scale(0) translate(0);
      transform: scale(0) translate(0);
      pointer-events: none
    }

    .md-waves-effect.md-waves-light .md-waves-ripple {
      background: hsla(0, 0%, 100%, .4);
      background: -webkit-radial-gradient(hsla(0, 0%, 100%, .2) 0, hsla(0, 0%, 100%, .3) 40%, hsla(0, 0%, 100%, .4) 50%, hsla(0, 0%, 100%, .5) 60%, hsla(0, 0%, 100%, 0) 70%);
      background: radial-gradient(hsla(0, 0%, 100%, .2) 0, hsla(0, 0%, 100%, .3) 40%, hsla(0, 0%, 100%, .4) 50%, hsla(0, 0%, 100%, .5) 60%, hsla(0, 0%, 100%, 0) 70%)
    }

    .md-waves-effect.md-waves-classic .md-waves-ripple {
      background: rgba(0, 0, 0, .2)
    }

    .md-waves-effect.md-waves-classic.md-waves-light .md-waves-ripple {
      background: hsla(0, 0%, 100%, .4)
    }

    .md-waves-notransition {
      -webkit-transition: none !important;
      transition: none !important
    }

    .md-waves-button,
    .md-waves-circle {
      -webkit-transform: translateZ(0);
      transform: translateZ(0);
      -webkit-mask-image: -webkit-radial-gradient(circle, #fff 100%, #000 0)
    }

    .md-waves-button,
    .md-waves-button-input,
    .md-waves-button:hover,
    .md-waves-button:visited {
      white-space: nowrap;
      vertical-align: middle;
      cursor: pointer;
      border: none;
      outline: none;
      color: inherit;
      background-color: transparent;
      font-size: 1em;
      line-height: 1em;
      text-align: center;
      text-decoration: none;
      z-index: 1
    }

    .md-waves-button {
      padding: .85em 1.1em;
      border-radius: .2em
    }

    .md-waves-button-input {
      margin: 0;
      padding: .85em 1.1em
    }

    .md-waves-input-wrapper {
      border-radius: .2em;
      vertical-align: bottom
    }

    .md-waves-input-wrapper.md-waves-button {
      padding: 0
    }

    .md-waves-input-wrapper .md-waves-button-input {
      position: relative;
      top: 0;
      left: 0;
      z-index: 1
    }

    .md-waves-circle {
      text-align: center;
      width: 2.5em;
      height: 2.5em;
      line-height: 2.5em;
      border-radius: 50%
    }

    .md-waves-float {
      -webkit-mask-image: none;
      box-shadow: 0 1px 1.5px 1px rgba(0, 0, 0, .12);
      -webkit-transition: all .3s;
      transition: all .3s
    }

    .md-waves-float:active {
      box-shadow: 0 8px 20px 1px rgba(0, 0, 0, .3)
    }

    .md-waves-block {
      display: block
    }
  </style>
  <style type="text/css">
    .simpread-font {
      font: 300 16px/1.8 -apple-system, PingFang SC, Microsoft Yahei, Lantinghei SC, Hiragino Sans GB, Microsoft Sans Serif, WenQuanYi Micro Hei, sans-serif;
      color: #333;
      text-rendering: optimizelegibility;
      -webkit-text-size-adjust: 100%;
      -webkit-font-smoothing: antialiased
    }

    .simpread-hidden {
      display: none
    }

    .simpread-read-root {
      display: -webkit-flex;
      -webkit-box-pack: center;
      -ms-flex-pack: center;
      justify-content: center;
      -webkit-box-align: center;
      -ms-flex-align: center;
      align-items: center;
      position: relative;
      margin: 0;
      top: -1000px;
      left: 0;
      width: 100%;
      z-index: 2147483646;
      overflow-x: hidden;
      opacity: 0;
      -webkit-transition: all 1s cubic-bezier(.23, 1, .32, 1) .1s;
      transition: all 1s cubic-bezier(.23, 1, .32, 1) .1s
    }

    .simpread-read-root-show {
      top: 0
    }

    .simpread-read-root-hide {
      top: 1000px
    }

    sr-read {
      display: -webkit-flex;
      -webkit-box-orient: vertical;
      -webkit-box-direction: normal;
      -ms-flex-flow: column nowrap;
      flex-flow: column;
      margin: 20px 20%;
      min-width: 400px;
      min-height: 400px;
      text-align: center
    }

    read-process {
      position: fixed;
      top: 0;
      left: 0;
      height: 3px;
      width: 100%;
      background-color: #64b5f6;
      -webkit-transition: width 2s;
      transition: width 2s;
      z-index: 20000
    }

    sr-rd-content-error {
      display: block;
      position: relative;
      margin: 0;
      margin-bottom: 30px;
      padding: 25px;
      background-color: rgba(0, 0, 0, .05)
    }

    sr-rd-footer {
      -webkit-box-orient: vertical;
      -ms-flex-direction: column;
      flex-direction: column;
      font-size: 14px
    }

    sr-rd-footer,
    sr-rd-footer-group {
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-direction: normal
    }

    sr-rd-footer-group {
      -webkit-box-orient: horizontal;
      -ms-flex-direction: row;
      flex-direction: row;
      -webkit-box-pack: center;
      -ms-flex-pack: center;
      justify-content: center;
      -webkit-box-align: center;
      -ms-flex-align: center;
      align-items: center
    }

    sr-rd-footer-line {
      width: 100%;
      border-top: 1px solid #e0e0e0
    }

    sr-rd-footer-text {
      min-width: 150px
    }

    sr-rd-footer-copywrite {
      margin: 10px 0 0;
      color: inherit
    }

    sr-rd-footer-copywrite abbr {
      -webkit-font-feature-settings: normal;
      font-feature-settings: normal;
      font-variant: normal;
      text-decoration: none
    }

    sr-rd-footer-copywrite .second {
      margin: 10px 0
    }

    sr-rd-footer-copywrite .third a:hover {
      border: none !important
    }

    sr-rd-footer-copywrite .third a:first-child {
      margin-right: 50px
    }

    sr-rd-footer-copywrite .sr-icon {
      display: -webkit-inline-box;
      display: -ms-inline-flexbox;
      display: inline-flex;
      -webkit-box-pack: center;
      -ms-flex-pack: center;
      justify-content: center;
      -webkit-box-align: center;
      -ms-flex-align: center;
      align-items: center;
      width: 33px;
      height: 33px;
      opacity: .8;
      -webkit-transition: opacity .5s ease;
      transition: opacity .5s ease;
      cursor: pointer
    }

    sr-rd-footer-copywrite .sr-icon:hover {
      opacity: 1
    }

    sr-rd-footer-copywrite a,
    sr-rd-footer-copywrite a:link,
    sr-rd-footer-copywrite a:visited {
      margin: 0;
      padding: 0;
      color: inherit;
      background-color: transparent;
      font-size: inherit !important;
      line-height: normal;
      text-decoration: none;
      vertical-align: baseline;
      vertical-align: initial;
      border: none !important;
      box-sizing: border-box
    }

    sr-rd-footer-copywrite a:focus,
    sr-rd-footer-copywrite a:hover,
    sr-rd-footer a:active {
      color: inherit;
      text-decoration: none;
      border-bottom: 1px dotted !important
    }

    .simpread-blocks {
      text-decoration: none !important
    }

    .simpread-blocks * {
      margin: 0
    }

    .simpread-blocks a {
      padding: 0;
      text-decoration: none !important
    }

    .simpread-blocks img {
      margin: 0;
      padding: 0;
      border: 0;
      background: transparent;
      box-shadow: none
    }

    .simpread-focus-root {
      display: block;
      position: fixed;
      top: 0;
      left: 0;
      right: 0;
      bottom: 0;
      background-color: hsla(0, 0%, 92%, .9);
      z-index: 2147483645;
      opacity: 0;
      -webkit-transition: opacity 1s cubic-bezier(.23, 1, .32, 1) 0ms;
      transition: opacity 1s cubic-bezier(.23, 1, .32, 1) 0ms
    }

    .simpread-focus-highlight {
      position: relative;
      box-shadow: 0 0 0 20px #fff;
      background-color: #fff;
      overflow: visible;
      z-index: 2147483646
    }

    .sr-controlbar-bg sr-rd-crlbar,
    .sr-controlbar-bg sr-rd-crlbar fab {
      z-index: 2147483647
    }

    sr-rd-crlbar.controlbar {
      position: fixed;
      right: 0;
      bottom: 0;
      width: 100px;
      height: 100%;
      opacity: 0;
      -webkit-transition: opacity .5s ease;
      transition: opacity .5s ease
    }

    sr-rd-crlbar.controlbar:hover {
      opacity: 1
    }

    sr-rd-crlbar fap * {
      box-sizing: border-box
    }

    @media (max-height:620px) {
      fab {
        zoom: .8
      }
    }

    @media (max-height:783px) {
      dialog-gp dialog-content {
        max-height: 580px
      }

      dialog-gp dialog-footer {
        border-top: 1px solid #e0e0e0
      }
    }

    .simpread-highlight-selector {
      outline: 3px dashed #1976d2 !important;
      cursor: pointer !important
    }

    .simpread-highlight-controlbar,
    .simpread-highlight-selector {
      background-color: #fafafa !important;
      opacity: .8 !important;
      -webkit-transition: opacity .5s ease !important;
      transition: opacity .5s ease !important
    }

    .simpread-highlight-controlbar {
      position: relative !important;
      border: 3px dashed #1976d2 !important
    }

    simpread-highlight,
    sr-snapshot-ctlbar {
      position: fixed;
      top: 0;
      left: 0;
      right: 0;
      padding: 15px;
      height: 50px;
      background-color: rgba(50, 50, 50, .9);
      box-shadow: 0 2px 5px rgba(0, 0, 0, .26);
      box-sizing: border-box;
      z-index: 2147483640
    }

    simpread-highlight,
    sr-highlight-ctl,
    sr-snapshot-ctlbar {
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-pack: center;
      -ms-flex-pack: center;
      justify-content: center;
      -webkit-box-align: center;
      -ms-flex-align: center;
      align-items: center
    }

    sr-highlight-ctl {
      margin: 0 5px;
      width: 50px;
      height: 20px;
      color: #fff;
      background-color: #1976d2;
      border-radius: 4px;
      box-shadow: 0 3px 1px -2px rgba(0, 0, 0, .2), 0 2px 2px 0 rgba(0, 0, 0, .14), 0 1px 5px 0 rgba(0, 0, 0, .12);
      cursor: pointer
    }

    toc-bg {
      position: fixed;
      left: 0;
      top: 0;
      width: 50px;
      height: 200px;
      font-size: medium
    }

    toc-bg:hover {
      z-index: 3
    }

    .toc-bg-hidden {
      opacity: 0;
      -webkit-transition: opacity .5s ease;
      transition: opacity .5s ease
    }

    .toc-bg-hidden:hover {
      opacity: 1;
      z-index: 3
    }

    .toc-bg-hidden:hover toc {
      width: 180px
    }

    toc * {
      all: unset
    }

    toc {
      position: fixed;
      left: 0;
      top: 100px;
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-orient: vertical;
      -webkit-box-direction: normal;
      -ms-flex-direction: column;
      flex-direction: column;
      -webkit-box-align: start;
      -ms-flex-align: start;
      align-items: flex-start;
      padding: 10px;
      width: 0;
      max-width: 200px;
      max-height: 500px;
      overflow-x: hidden;
      overflow-y: hidden;
      cursor: pointer;
      border: 1px solid hsla(0, 0%, 62%, .22);
      -webkit-transition: width .5s;
      transition: width .5s
    }

    toc:hover {
      overflow-y: auto
    }

    toc.mini:hover {
      width: 200px !important
    }

    toc::-webkit-scrollbar {
      width: 3px
    }

    toc::-webkit-scrollbar-thumb {
      border-radius: 10px;
      background-color: hsla(36, 2%, 54%, .5)
    }

    toc outline {
      position: relative;
      display: -webkit-box;
      -webkit-line-clamp: 1;
      -webkit-box-orient: vertical;
      overflow: hidden;
      text-overflow: ellipsis;
      padding: 2px 0;
      min-height: 21px;
      line-height: 21px;
      text-align: left
    }

    toc outline a,
    toc outline a:active,
    toc outline a:focus,
    toc outline a:visited {
      display: block;
      width: 100%;
      color: inherit;
      font-size: 11px;
      text-decoration: none !important;
      white-space: nowrap;
      overflow: hidden;
      text-overflow: ellipsis
    }

    toc outline a:hover {
      font-weight: 700 !important
    }

    toc outline a.toc-outline-theme-dark,
    toc outline a.toc-outline-theme-night {
      color: #fff !important
    }

    .toc-level-h1 {
      padding-left: 5px
    }

    .toc-level-h2 {
      padding-left: 15px
    }

    .toc-level-h3 {
      padding-left: 25px
    }

    .toc-level-h4 {
      padding-left: 35px
    }

    .toc-outline-active {
      border-left: 2px solid #f44336
    }

    toc outline active {
      position: absolute;
      left: 0;
      top: 0;
      bottom: 0;
      padding: 0 0 0 3px;
      border-left: 2px solid #e8e8e8
    }

    sr-kbd {
      background: -webkit-gradient(linear, 0 0, 0 100%, from(#fff785), to(#ffc542));
      border: 1px solid #e3be23;
      -o-border-image: none;
      border-image: none;
      -o-border-image: initial;
      border-image: initial;
      position: absolute;
      left: 0;
      padding: 1px 3px 0;
      font-size: 11px !important;
      font-weight: 700;
      box-shadow: 0 3px 7px 0 rgba(0, 0, 0, .3);
      overflow: hidden;
      border-radius: 3px
    }

    .sr-kbd-a {
      position: relative
    }

    kbd-mapping {
      position: fixed;
      left: 5px;
      bottom: 5px;
      -ms-flex-flow: row;
      flex-flow: row;
      width: 250px;
      height: 500px;
      background-color: #fff;
      border: 1px solid hsla(0, 0%, 62%, .22);
      box-shadow: 0 2px 5px rgba(0, 0, 0, .26);
      border-radius: 3px
    }

    kbd-mapping,
    kbd-maps {
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-orient: vertical;
      -webkit-box-direction: normal;
      -ms-flex-direction: column;
      flex-direction: column
    }

    kbd-maps {
      margin: 40px 0 20px;
      width: 100%;
      overflow-x: auto
    }

    kbd-maps::-webkit-scrollbar-thumb {
      background-clip: padding-box;
      border-radius: 10px;
      border: 2px solid transparent;
      background-color: rgba(85, 85, 85, .55)
    }

    kbd-maps::-webkit-scrollbar {
      width: 10px;
      -webkit-transition: width .7s cubic-bezier(.4, 0, .2, 1);
      transition: width .7s cubic-bezier(.4, 0, .2, 1)
    }

    kbd-mapping kbd-map-title {
      position: absolute;
      margin: 5px 0;
      width: 100%;
      font-size: 14px;
      font-weight: 700
    }

    kbd-maps-group {
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-orient: vertical;
      -webkit-box-direction: normal;
      -ms-flex-direction: column;
      flex-direction: column;
      -webkit-box-align: start;
      -ms-flex-align: start;
      align-items: flex-start
    }

    kbd-maps-title {
      margin: 5px 0;
      padding-left: 53px;
      font-size: 12px;
      font-weight: 700
    }

    kbd-map kbd {
      display: inline-block;
      padding: 3px 5px;
      font-size: 11px;
      line-height: 10px;
      color: #444d56;
      vertical-align: middle;
      background-color: #fafbfc;
      border: 1px solid #c6cbd1;
      border-bottom-color: #959da5;
      border-radius: 3px;
      box-shadow: inset 0 -1px 0 #959da5
    }

    kbd-map kbd-name {
      display: inline-block;
      text-align: right;
      width: 50px
    }

    kbd-map kbd-desc {
      padding-left: 3px
    }

    sharecard-bg {
      position: fixed;
      top: 0;
      left: 0;
      width: 100%;
      height: 100%;
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-pack: center;
      -ms-flex-pack: center;
      justify-content: center;
      -webkit-box-align: center;
      -ms-flex-align: center;
      align-items: center;
      background-color: rgba(0, 0, 0, .4);
      z-index: 2147483647
    }

    sharecard {
      max-width: 450px;
      background-color: #64b5f6
    }

    sharecard,
    sharecard-head {
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-orient: vertical;
      -webkit-box-direction: normal;
      -ms-flex-direction: column;
      flex-direction: column
    }

    sharecard-head {
      margin: 25px;
      color: #fff;
      border-radius: 10px;
      box-shadow: 0 2px 6px 0 rgba(0, 0, 0, .2), 0 25px 50px 0 rgba(0, 0, 0, .15)
    }

    sharecard-card {
      -webkit-box-orient: vertical;
      -webkit-box-direction: normal;
      -ms-flex-direction: column;
      flex-direction: column
    }

    sharecard-card,
    sharecard-top {
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex
    }

    sharecard-top {
      -webkit-box-align: center;
      -ms-flex-align: center;
      align-items: center;
      -webkit-box-pack: center;
      -ms-flex-pack: center;
      justify-content: center;
      padding-right: 5px;
      height: 65px;
      background-color: #fff;
      color: #878787;
      font-size: 25px;
      font-weight: 500;
      border-top-left-radius: 10px;
      border-top-right-radius: 10px
    }

    sharecard-top span.logos {
      display: block;
      width: 48px;
      height: 48px;
      margin: 5px;
      background-repeat: no-repeat;
      background-position: 50%;
      background-image: url("");
      zoom: .8
    }

    sharecard-content {
      padding: 15px;
      max-height: 500px;
      font-size: 20px;
      text-align: justify;
      background-color: #2196f3;
      overflow-x: hidden;
      overflow-y: auto
    }

    sharecard-via {
      padding: 10px;
      font-size: 10px;
      background-color: #2196f3
    }

    sharecard-footer {
      -webkit-box-orient: horizontal;
      -webkit-box-direction: normal;
      -ms-flex-direction: row;
      flex-direction: row;
      -webkit-box-pack: center;
      -ms-flex-pack: center;
      justify-content: center;
      padding-right: 5px;
      height: 100px;
      background-color: #fff;
      color: #878787;
      font-size: 15px;
      font-weight: 500;
      border-bottom-left-radius: 10px;
      border-bottom-right-radius: 10px
    }

    sharecard-footer,
    sharecard-footer div {
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-align: center;
      -ms-flex-align: center;
      align-items: center
    }

    sharecard-footer span.qrcode {
      display: block;
      width: 100px;
      height: 100px;
      margin: 5px;
      background-repeat: no-repeat;
      background-position: 50%;
      background-image: url("")
    }

    sharecard-control {
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-orient: horizontal;
      -webkit-box-direction: normal;
      -ms-flex-direction: row;
      flex-direction: row;
      -webkit-box-align: center;
      -ms-flex-align: center;
      align-items: center;
      padding: 0 19px;
      height: 80px;
      background-color: #fff
    }

    simpread-snapshot {
      width: 100%;
      height: 100%;
      cursor: move;
      z-index: 2147483645
    }

    simpread-snapshot,
    sr-mask {
      position: fixed;
      left: 0;
      top: 0
    }

    sr-mask {
      background-color: rgba(0, 0, 0, .1)
    }

    .simpread-feedback,
    .simpread-urlscheme {
      position: fixed;
      right: 20px;
      bottom: 20px;
      z-index: 2147483646
    }

    simpread-feedback,
    simpread-urlscheme {
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-pack: center;
      -ms-flex-pack: center;
      justify-content: center;
      -webkit-box-align: start;
      -ms-flex-align: start;
      align-items: flex-start;
      -webkit-box-orient: vertical;
      -webkit-box-direction: normal;
      -ms-flex-direction: column;
      flex-direction: column;
      padding: 20px 20px 0;
      width: 500px;
      color: rgba(51, 51, 51, .87);
      background-color: #fff;
      border-radius: 3px;
      box-shadow: 0 0 2px rgba(0, 0, 0, .12), 0 2px 2px rgba(0, 0, 0, .26);
      overflow: hidden;
      -webkit-transform-origin: bottom;
      transform-origin: bottom;
      -webkit-transition: all .6s ease;
      transition: all .6s ease
    }

    simpread-feedback *,
    simpread-urlscheme * {
      font-size: 12px !important;
      box-sizing: border-box
    }

    simpread-feedback.active,
    simpread-urlscheme.active {
      -webkit-animation-name: srFadeInUp;
      animation-name: srFadeInUp;
      -webkit-animation-duration: .45s;
      animation-duration: .45s;
      -webkit-animation-fill-mode: both;
      animation-fill-mode: both
    }

    simpread-feedback.hide,
    simpread-urlscheme.hide {
      -webkit-animation-name: srFadeInDown;
      animation-name: srFadeInDown;
      -webkit-animation-duration: .45s;
      animation-duration: .45s;
      -webkit-animation-fill-mode: both;
      animation-fill-mode: both
    }

    simpread-feedback sr-fb-label,
    simpread-urlscheme sr-urls-label {
      width: 100%
    }

    simpread-feedback sr-fb-head,
    simpread-urlscheme sr-urls-head {
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-align: center;
      -ms-flex-align: center;
      align-items: center;
      -webkit-box-orient: horizontal;
      -webkit-box-direction: normal;
      -ms-flex-direction: row;
      flex-direction: row;
      margin-bottom: 5px;
      width: 100%
    }

    simpread-feedback sr-fb-content,
    simpread-urlscheme sr-urls-content {
      margin-bottom: 5px;
      width: 100%
    }

    simpread-feedback sr-urls-footer,
    simpread-urlscheme sr-urls-footer {
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-pack: end;
      -ms-flex-pack: end;
      justify-content: flex-end;
      width: 100%
    }

    simpread-feedback sr-fb-a,
    simpread-urlscheme sr-urls-a {
      color: #2163f7;
      cursor: pointer
    }

    simpread-feedback text-field-state,
    simpread-urlscheme text-field-state {
      border-top: none rgba(34, 101, 247, .8) !important;
      border-left: none rgba(34, 101, 247, .8) !important;
      border-right: none rgba(34, 101, 247, .8) !important;
      border-bottom: 2px solid rgba(34, 101, 247, .8) !important
    }

    simpread-feedback switch,
    simpread-urlscheme switch {
      margin-top: 0 !important
    }

    @-webkit-keyframes srFadeInUp {
      0% {
        opacity: 0;
        -webkit-transform: translateY(100px);
        transform: translateY(100px)
      }

      to {
        opacity: 1;
        -webkit-transform: translateY(0);
        transform: translateY(0)
      }
    }

    @keyframes srFadeInUp {
      0% {
        opacity: 0;
        -webkit-transform: translateY(100px);
        transform: translateY(100px)
      }

      to {
        opacity: 1;
        -webkit-transform: translateY(0);
        transform: translateY(0)
      }
    }

    @-webkit-keyframes srFadeInDown {
      0% {
        opacity: 1;
        -webkit-transform: translateY(0);
        transform: translateY(0)
      }

      to {
        opacity: 0;
        -webkit-transform: translateY(100px);
        transform: translateY(100px)
      }
    }

    @keyframes srFadeInDown {
      0% {
        opacity: 1;
        -webkit-transform: translateY(0);
        transform: translateY(0)
      }

      to {
        opacity: 0;
        -webkit-transform: translateY(100px);
        transform: translateY(100px)
      }
    }

    simpread-feedback sr-fb-head {
      font-weight: 700
    }

    simpread-feedback sr-fb-content {
      -webkit-box-orient: vertical;
      -ms-flex-direction: column;
      flex-direction: column
    }

    simpread-feedback sr-fb-content,
    simpread-feedback sr-fb-footer {
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-direction: normal
    }

    simpread-feedback sr-fb-footer {
      -webkit-box-orient: horizontal;
      -ms-flex-direction: row;
      flex-direction: row;
      -webkit-box-pack: end;
      -ms-flex-pack: end;
      justify-content: flex-end;
      width: 100%
    }

    simpread-feedback sr-close {
      position: absolute;
      right: 20px;
      cursor: pointer;
      -webkit-transition: all 1s cubic-bezier(.23, 1, .32, 1) .1s;
      transition: all 1s cubic-bezier(.23, 1, .32, 1) .1s;
      z-index: 200
    }

    simpread-feedback sr-close:hover {
      -webkit-transform: rotate(-15deg) scale(1.3);
      transform: rotate(-15deg) scale(1.3)
    }

    simpread-feedback sr-stars {
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-orient: horizontal;
      -webkit-box-direction: normal;
      -ms-flex-direction: row;
      flex-direction: row;
      -webkit-box-pack: center;
      -ms-flex-pack: center;
      justify-content: center;
      margin-top: 10px
    }

    simpread-feedback sr-stars i {
      margin-right: 10px;
      cursor: pointer
    }

    simpread-feedback sr-stars i svg {
      -webkit-transition: all 1s cubic-bezier(.23, 1, .32, 1) .1s;
      transition: all 1s cubic-bezier(.23, 1, .32, 1) .1s
    }

    simpread-feedback sr-stars i svg:hover {
      -webkit-transform: rotate(-15deg) scale(1.3);
      transform: rotate(-15deg) scale(1.3)
    }

    simpread-feedback sr-stars i.active svg {
      -webkit-transform: rotate(0) scale(1);
      transform: rotate(0) scale(1)
    }

    simpread-feedback sr-emojis {
      display: block;
      height: 100px;
      overflow: hidden
    }

    simpread-feedback sr-emoji {
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-orient: vertical;
      -webkit-box-direction: normal;
      -ms-flex-direction: column;
      flex-direction: column;
      -webkit-box-align: center;
      -ms-flex-align: center;
      align-items: center;
      -webkit-transition: .3s;
      transition: .3s
    }

    simpread-feedback sr-emoji>svg {
      margin: 15px 0;
      width: 70px;
      height: 70px;
      -ms-flex-negative: 0;
      flex-shrink: 0
    }

    simpread-feedback sr-stars-footer {
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-pack: center;
      -ms-flex-pack: center;
      justify-content: center;
      margin: 10px 0 20px
    }
  </style>
  <style type="text/css">
    sr-opt-focus,
    sr-opt-read {
      -webkit-box-orient: vertical;
      -ms-flex-direction: column;
      flex-direction: column
    }

    sr-opt-focus,
    sr-opt-gp,
    sr-opt-read {
      display: -webkit-flex;
      -webkit-box-direction: normal;
      width: 100%
    }

    sr-opt-gp {
      position: relative;
      -webkit-box-orient: horizontal;
      -ms-flex-flow: row nowrap;
      flex-flow: row;
      -webkit-box-pack: start;
      -ms-flex-pack: start;
      justify-content: flex-start;
      margin-bottom: 25px;
      font-size: 15px
    }

    sr-opt-gp input,
    sr-opt-gp textarea {
      font-family: DIN-Regular, Bookerly, Georgia, -apple-system, PingFang SC, Microsoft Yahei, Lantinghei SC, Hiragino Sans GB, Microsoft Sans Serif, WenQuanYi Micro Hei, sans-serif !important
    }

    sr-opt-gp sr-opt-label {
      display: block;
      position: absolute;
      margin: -8px 0 0;
      font-size: 14px;
      font-weight: 700;
      color: rgba(0, 137, 123, .8);
      -webkit-user-select: none;
      -moz-user-select: none;
      -ms-user-select: none;
      user-select: none;
      pointer-events: none;
      -webkit-transform: scale(.75) translateY(-8px);
      transform: scale(.75) translateY(-8px);
      -webkit-transform-origin: left top 0;
      transform-origin: left top 0
    }

    sr-opt-themes {
      display: -webkit-flex;
      -webkit-box-orient: horizontal;
      -webkit-box-direction: normal;
      -ms-flex-flow: row nowrap;
      flex-flow: row;
      -webkit-box-pack: justify;
      -ms-flex-pack: justify;
      justify-content: space-between;
      width: 100%;
      margin: 8px 0 17px;
      padding: 0
    }

    sr-opt-theme {
      width: 40px;
      height: 20px;
      cursor: pointer;
      list-style: none;
      border-radius: 3px;
      border: 1px solid #212121;
      box-sizing: border-box;
      opacity: 1;
      -webkit-transition: all .5s cubic-bezier(.23, 1, .32, 1) 0ms;
      transition: all .5s cubic-bezier(.23, 1, .32, 1) 0ms
    }

    sr-opt-theme:hover {
      -webkit-transform: translateY(-1px);
      transform: translateY(-1px);
      box-shadow: 0 5px 10px rgba(0, 0, 0, .2)
    }

    sr-opt-theme:not(:first-child) {
      margin-left: 5px
    }

    sr-opt-theme[sr-type=active] {
      box-shadow: 0 5px 10px rgba(0, 0, 0, .2);
      border: none
    }

    sr-opt-focus text-field-float,
    sr-opt-read text-field-float {
      color: rgba(0, 137, 123, .8) !important
    }

    sr-opt-focus text-field-state,
    sr-opt-read text-field-state {
      border-bottom-color: rgba(0, 137, 123, .8) !important
    }

    sr-opt-gp svg {
      -webkit-animation: none 0s ease 0s 1 normal none running;
      animation: none 0s ease 0s 1 normal none running;
      -webkit-backface-visibility: visible;
      backface-visibility: visible;
      background: transparent none repeat 0 0/auto auto padding-box border-box scroll;
      border: medium none currentColor;
      border-collapse: separate;
      -o-border-image: none;
      border-image: none;
      border-radius: 0;
      border-spacing: 0;
      bottom: auto;
      box-shadow: none;
      box-sizing: content-box;
      caption-side: top;
      clear: none;
      clip: auto;
      color: #000;
      -webkit-columns: auto;
      -moz-columns: auto;
      columns: auto;
      -webkit-column-count: auto;
      -moz-column-count: auto;
      column-count: auto;
      -webkit-column-fill: balance;
      -moz-column-fill: balance;
      column-fill: balance;
      -webkit-column-gap: normal;
      -moz-column-gap: normal;
      column-gap: normal;
      -webkit-column-rule: medium none currentColor;
      -moz-column-rule: medium none currentColor;
      column-rule: medium none currentColor;
      -webkit-column-span: 1;
      -moz-column-span: 1;
      column-span: 1;
      -webkit-column-width: auto;
      -moz-column-width: auto;
      column-width: auto;
      content: normal;
      counter-increment: none;
      counter-reset: none;
      cursor: auto;
      direction: ltr;
      display: inline;
      empty-cells: show;
      float: none;
      font-family: serif;
      font-size: medium;
      font-style: normal;
      font-variant: normal;
      font-weight: 400;
      font-stretch: normal;
      line-height: normal;
      height: auto;
      -webkit-hyphens: none;
      -ms-hyphens: none;
      hyphens: none;
      left: auto;
      letter-spacing: normal;
      list-style: disc outside none;
      margin: 0;
      max-height: none;
      max-width: none;
      min-height: 0;
      min-width: 0;
      opacity: 1;
      orphans: 2;
      outline: medium none invert;
      overflow: visible;
      overflow-x: visible;
      overflow-y: visible;
      padding: 0;
      page-break-after: auto;
      page-break-before: auto;
      page-break-inside: auto;
      -webkit-perspective: none;
      perspective: none;
      -webkit-perspective-origin: 50% 50%;
      perspective-origin: 50% 50%;
      position: static;
      right: auto;
      -moz-tab-size: 8;
      -o-tab-size: 8;
      tab-size: 8;
      table-layout: auto;
      text-align: left;
      text-align-last: auto;
      text-decoration: none;
      text-indent: 0;
      text-shadow: none;
      text-transform: none;
      top: auto;
      -webkit-transform: none;
      transform: none;
      -webkit-transform-origin: 50% 50% 0;
      transform-origin: 50% 50% 0;
      -webkit-transform-style: flat;
      transform-style: flat;
      -webkit-transition: none 0s ease 0s;
      transition: none 0s ease 0s;
      unicode-bidi: normal;
      vertical-align: baseline;
      visibility: visible;
      white-space: normal;
      widows: 2;
      width: auto;
      word-spacing: normal;
      z-index: auto;
      all: initial
    }

    sr-opt-gp actions {
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -ms-flex-wrap: wrap;
      flex-wrap: wrap;
      width: 100%
    }

    sr-opt-gp action-item {
      display: -webkit-box !important;
      display: -ms-flexbox !important;
      display: flex !important;
      -webkit-box-orient: horizontal;
      -webkit-box-direction: normal;
      -ms-flex-direction: row;
      flex-direction: row;
      -webkit-box-align: center;
      -ms-flex-align: center;
      align-items: center;
      width: 100%;
      padding: 5px 0
    }

    sr-opt-gp action-item:first-child {
      padding-top: 10px
    }

    sr-opt-gp action-label {
      font-size: 12px;
      font-weight: 400;
      margin-left: 10px
    }

    sr-opt-gp action-icon {
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-pack: center;
      -ms-flex-pack: center;
      justify-content: center
    }

    sr-opt-gp action-icon,
    sr-opt-gp action-rect {
      -webkit-box-align: center;
      -ms-flex-align: center;
      align-items: center
    }

    sr-opt-gp action-rect {
      display: -webkit-box !important;
      display: -ms-flexbox !important;
      display: flex !important;
      -webkit-box-orient: horizontal;
      -webkit-box-direction: normal;
      -ms-flex-direction: row;
      flex-direction: row
    }

    sr-opt-gp export-icon {
      display: block;
      padding: 3px;
      width: 21px;
      height: 21px;
      background-size: 64%;
      background-position: 50%;
      background-repeat: no-repeat;
      border: none;
      border-radius: 4px
    }

    sr-opt-gp export-icon.symbol {
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-pack: center;
      -ms-flex-pack: center;
      justify-content: center;
      -webkit-box-align: center;
      -ms-flex-align: center;
      align-items: center
    }

    sr-opt-gp export-icon i {
      color: #fff;
      font-size: 12px
    }

    sr-opt-gp action-item[action=joplin] export-icon {
      background-size: 50%
    }

    sr-opt-gp action-item[action=focusnote] export-icon {
      background-size: 42%
    }

    style-bar {
      margin-bottom: 10px
    }

    style-bar sr-opt-read-adv sr-opt-gp {
      margin: 10px 0 0
    }

    style-bar sr-opt-read-adv sr-opt-gp.large {
      position: relative;
      margin-top: 25px
    }

    sr-opt-read-adv sr-opt-gp:last-child {
      margin-bottom: 0
    }

    style-bar sr-opt-gp:last-child {
      margin-bottom: 10px
    }

    style-bar sr-opt-read-adv sr-opt-label.row {
      -webkit-box-orient: horizontal;
      -webkit-box-direction: normal;
      -ms-flex-direction: row;
      flex-direction: row;
      pointer-events: auto;
      cursor: pointer
    }

    style-bar sr-opt-read-adv sr-opt-label.row,
    style-bar sr-opt-read-adv sr-opt-label sr-opt-icon {
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-pack: center;
      -ms-flex-pack: center;
      justify-content: center
    }

    style-bar sr-opt-read-adv sr-opt-label sr-opt-icon {
      -webkit-box-align: center;
      -ms-flex-align: center;
      align-items: center;
      -webkit-transform: rotate(90deg);
      transform: rotate(90deg);
      -webkit-transition: all .25s ease-out;
      transition: all .25s ease-out
    }

    style-bar sr-opt-read-adv sr-opt-label sr-opt-icon.open {
      -webkit-transform: rotate(270deg);
      transform: rotate(270deg)
    }

    style-bar sr-opt-read-adv.dividers {
      border-top: 1px solid #eaeaea;
      border-bottom: 1px solid #eaeaea
    }

    style-bar switch {
      margin: 0 !important
    }

    style-bar switch span {
      font-size: 13px !important;
      font-weight: 700 !important
    }

    style-bar switch subtitle {
      font-size: 12px !important
    }

    style-bar text-field textarea {
      resize: vertical !important
    }

    style-bar sr-opt-button {
      position: absolute !important;
      right: 12px;
      bottom: 14px;
      display: -webkit-box !important;
      display: -ms-flexbox !important;
      display: flex !important;
      -webkit-box-pack: center;
      -ms-flex-pack: center;
      justify-content: center;
      -webkit-box-align: center;
      -ms-flex-align: center;
      align-items: center;
      padding: 3px;
      border-radius: 50%;
      -webkit-transition: all .25s ease-out;
      transition: all .25s ease-out
    }

    style-bar sr-opt-button,
    style-bar sr-opt-button svg {
      cursor: pointer !important
    }

    style-bar text-field.hidden+sr-opt-button {
      opacity: 0
    }
  </style>
  <style type="text/css">
    notify-gp {
      font: 300 14px -apple-system, PingFang SC, Microsoft Yahei, Lantinghei SC, Hiragino Sans GB, Microsoft Sans Serif, WenQuanYi Micro Hei, sans-serif;
      text-rendering: optimizelegibility;
      -webkit-text-size-adjust: 100%;
      -webkit-font-smoothing: antialiased;
      display: -webkit-flex;
      -webkit-box-orient: vertical;
      -webkit-box-direction: normal;
      -ms-flex-flow: column nowrap;
      flex-flow: column;
      -webkit-box-align: end;
      -ms-flex-align: end;
      align-items: flex-end;
      position: fixed;
      top: 0;
      right: 0;
      margin: 0 15px 0 0;
      padding: 0;
      text-transform: none;
      pointer-events: none
    }

    notify-gp notify {
      display: -webkit-flex;
      -webkit-box-align: center;
      -ms-flex-align: center;
      align-items: center;
      margin: 0;
      margin-top: 15px;
      padding: 14px 24px;
      min-width: 288px;
      max-width: 568px;
      min-height: 48px;
      color: hsla(0, 0%, 100%, .9);
      background-color: #000;
      box-sizing: border-box;
      border-radius: 4px;
      pointer-events: auto;
      -webkit-user-select: none;
      -moz-user-select: none;
      -ms-user-select: none;
      user-select: none;
      opacity: 0;
      -webkit-transform: scaleY(0);
      transform: scaleY(0);
      -webkit-transform-origin: left top 0;
      transform-origin: left top 0;
      -webkit-transition: all .45s cubic-bezier(.23, 1, .32, 1) 0ms, opacity 1s cubic-bezier(.23, 1, .32, 1) 0ms;
      transition: all .45s cubic-bezier(.23, 1, .32, 1) 0ms, opacity 1s cubic-bezier(.23, 1, .32, 1) 0ms;
      box-shadow: 0 3px 5px -1px rgba(0, 0, 0, .2), 0 6px 10px 0 rgba(0, 0, 0, .14), 0 1px 18px 0 rgba(0, 0, 0, .12)
    }

    notify-gp notify-title {
      font-size: 13px;
      font-weight: 700
    }

    notify-gp notify-content {
      display: block;
      font-size: 14px;
      font-weight: 400;
      text-align: left;
      overflow: hidden
    }

    notify-gp notify-content a,
    notify-gp notify-content a:active,
    notify-gp notify-content a:link,
    notify-gp notify-content a:visited {
      margin: inherit;
      padding-bottom: 5px;
      color: #fff;
      font-size: inherit;
      text-decoration: none;
      -webkit-transition: color .5s;
      transition: color .5s
    }

    notify-gp notify-content a:hover {
      margin: 0;
      margin: initial;
      padding: 0;
      padding: initial;
      color: inherit;
      font-size: inherit;
      text-decoration: none
    }

    notify-gp notify-i {
      display: none;
      -webkit-box-pack: center;
      -ms-flex-pack: center;
      justify-content: center;
      -webkit-box-align: center;
      -ms-flex-align: center;
      align-items: center;
      margin: 0 10px 0 0;
      width: 24px;
      height: 24px;
      background-position: 50%;
      background-repeat: no-repeat
    }

    notify-gp notify-action,
    notify-gp notify-cancel {
      display: none;
      margin: 0 8px;
      max-width: 80px;
      min-width: 56px;
      height: 36px;
      line-height: 34px;
      color: #bb86fc;
      font-weight: 500;
      font-size: inherit;
      text-transform: uppercase;
      text-align: center;
      overflow: hidden;
      text-overflow: ellipsis;
      white-space: nowrap;
      -webkit-transition: all .5s cubic-bezier(.23, 1, .32, 1) 0ms;
      transition: all .5s cubic-bezier(.23, 1, .32, 1) 0ms;
      cursor: pointer
    }

    notify-gp .notify-error notify-action,
    notify-gp .notify-error notify-cancel,
    notify-gp .notify-success notify-action,
    notify-gp .notify-success notify-cancel,
    notify-gp .notify-warning notify-action,
    notify-gp .notify-warning notify-cancel {
      color: #fff
    }

    notify-gp notify-action:active,
    notify-gp notify-cancel:active {
      border-radius: 4px;
      background-color: rgba(98, 0, 238, .3)
    }

    notify-gp notify-cancel {
      margin: 0
    }

    notify-gp notify-a {
      display: block;
      position: absolute;
      top: 5px;
      right: 5px;
      cursor: pointer
    }

    notify-gp notify-exit {
      display: none;
      -webkit-box-pack: center;
      -ms-flex-pack: center;
      justify-content: center;
      -webkit-box-align: center;
      -ms-flex-align: center;
      align-items: center;
      margin-left: 5px;
      width: 36px;
      height: 36px;
      min-width: 36px;
      min-height: 36px;
      background-color: transparent;
      border-radius: 50%;
      -webkit-transition: all .5s cubic-bezier(.23, 1, .32, 1) 0ms;
      transition: all .5s cubic-bezier(.23, 1, .32, 1) 0ms;
      cursor: pointer
    }

    notify-gp notify-exit:hover {
      background-color: hsla(0, 0%, 100%, .4)
    }

    notify-gp notify-exit:active {
      background-color: hsla(0, 0%, 100%, .2)
    }

    notify-gp notify-a notify-span {
      display: block;
      width: 16px;
      height: 16px;
      background-image: url();
      opacity: .9
    }

    notify-gp notify-i.holdon {
      display: block;
      margin: 0 0 0 24px;
      width: 20px;
      height: 20px;
      background-image: url();
      cursor: pointer
    }

    notify-gp .notify-show {
      opacity: 1;
      -webkit-transform: scaleY(1) !important;
      transform: scaleY(1) !important
    }

    notify-gp .notify-hide {
      -webkit-animation-name: fadeOutUp;
      animation-name: fadeOutUp;
      -webkit-animation-duration: .45s;
      animation-duration: .45s;
      -webkit-animation-fill-mode: both;
      animation-fill-mode: both
    }

    notify-gp .notify-success {
      background-color: #4caf50
    }

    notify-gp .notify-warning {
      background-color: #ffa000
    }

    notify-gp .notify-error {
      background-color: #ef5350
    }

    notify-gp .notify-info {
      background-color: #1976d2
    }

    notify-gp .notify-modal {
      -webkit-box-orient: vertical;
      -webkit-box-direction: normal;
      -ms-flex-flow: column nowrap;
      flex-flow: column;
      -webkit-box-align: start;
      -ms-flex-align: start;
      align-items: flex-start;
      height: auto;
      max-height: 200px;
      box-shadow: 0 2px 2px 0 rgba(0, 0, 0, .14), 0 1px 5px 0 rgba(0, 0, 0, .12), 0 3px 1px -2px rgba(0, 0, 0, .2)
    }

    notify-gp .notify-modal .notify-modal-content {
      margin-top: 5px;
      font-size: 13px;
      white-space: normal
    }

    notify-gp .notify-modal .notify-modal-content a {
      margin: 0;
      padding: 0;
      color: inherit;
      font-size: inherit;
      text-decoration: underline;
      cursor: pointer
    }

    notify-gp .notify-modal .notify-modal-content a:active,
    notify-gp .notify-modal .notify-modal-content a:focus,
    notify-gp .notify-modal .notify-modal-content a:hover,
    notify-gp .notify-modal .notify-modal-content a:visited {
      color: inherit
    }

    notify-gp .notify-snackbar {
      position: fixed;
      bottom: 0;
      left: 50%;
      margin-bottom: 5px;
      -webkit-transform-origin: left bottom 0;
      transform-origin: left bottom 0
    }

    .notify-position-lt-corner {
      -webkit-box-align: start;
      -ms-flex-align: start;
      align-items: flex-start;
      margin: 0 0 0 15px;
      left: 0;
      right: auto
    }

    .notify-position-lb-corner {
      margin: 0 0 15px 15px;
      right: auto;
      left: 0
    }

    .notify-position-lb-corner,
    .notify-position-rb-corner {
      -webkit-box-orient: vertical;
      -webkit-box-direction: reverse;
      -ms-flex-flow: column-reverse wrap-reverse;
      flex-flow: column-reverse wrap-reverse;
      top: auto;
      bottom: 0
    }

    .notify-position-rb-corner {
      -webkit-box-align: start;
      -ms-flex-align: start;
      align-items: flex-start;
      margin: 0 15px 15px 0;
      left: auto;
      right: 0
    }

    @-webkit-keyframes fadeOutUp {
      0% {
        opacity: 1
      }

      to {
        margin-top: 0;
        padding: 0;
        height: 0;
        min-height: 0;
        opacity: 0;
        -webkit-transform: scaleY(0);
        transform: scaleY(0)
      }
    }

    @keyframes fadeOutUp {
      0% {
        opacity: 1
      }

      to {
        margin-top: 0;
        padding: 0;
        height: 0;
        min-height: 0;
        opacity: 0;
        -webkit-transform: scaleY(0);
        transform: scaleY(0)
      }
    }

    @media (pointer:coarse) {
      notify-gp {
        top: auto;
        bottom: 0;
        left: 0;
        margin: 0 10px 10px
      }

      notify-gp notify {
        width: 100%;
        max-width: 600px
      }

      notify-gp .notify-hide,
      notify-gp .notify-show {
        -webkit-transform-origin: bottom !important;
        transform-origin: bottom !important
      }

      notify-gp .notify-snackbar {
        position: static
      }
    }
  </style>
  <style type="text/css">
    dialog-gp .carousel,
    welcome .carousel {
      position: relative;
      width: 100%;
      height: 400px;
      -webkit-perspective: 500px;
      perspective: 500px;
      -webkit-transform-style: preserve-3d;
      transform-style: preserve-3d;
      -webkit-transform-origin: 0 50%;
      transform-origin: 0 50%;
      overflow: hidden
    }

    dialog-gp .carousel.carousel-slider,
    welcome .carousel.carousel-slider {
      top: 0;
      left: 0;
      height: 100%
    }

    dialog-gp .carousel.carousel-slider .carousel-item,
    welcome .carousel.carousel-slider .carousel-item {
      position: absolute;
      top: 0;
      left: 0;
      width: 100%;
      height: 100%;
      min-height: 400px
    }

    dialog-gp .carousel .carousel-item,
    welcome .carousel .carousel-item {
      display: none;
      position: absolute;
      top: 0;
      left: 0;
      width: 200px;
      height: 200px
    }

    dialog-gp .carousel .carousel-item>img,
    welcome .carousel .carousel-item>img {
      width: 100%
    }

    dialog-gp .carousel .indicators,
    welcome .carousel .indicators {
      position: absolute;
      margin: 0;
      padding: 0;
      left: 0;
      right: 0;
      bottom: 0;
      text-align: center
    }

    dialog-gp .carousel .indicators .indicator-item,
    welcome .carousel .indicators .indicator-item {
      display: inline-block;
      position: relative;
      margin: 14px 4px;
      height: 10px;
      width: 10px;
      background-color: #e0e0e0;
      -webkit-transition: background-color .3s;
      transition: background-color .3s;
      border-radius: 50%;
      cursor: pointer
    }

    dialog-gp .carousel .indicators .indicator-item.active,
    welcome .carousel .indicators .indicator-item.active {
      background-color: #4caf50
    }

    dialog-gp .carousel .carousel-item:not(.active) .materialboxed,
    dialog-gp .carousel.scrolling .carousel-item .materialboxed,
    welcome .carousel .carousel-item:not(.active) .materialboxed,
    welcome .carousel.scrolling .carousel-item .materialboxed {
      pointer-events: none
    }
  </style>
  <style type="text/css">
    .simpread-upgrade-root * {
      box-sizing: border-box
    }

    .simpread-upgrade-root {
      -webkit-transition: all .25s ease-out;
      transition: all .25s ease-out
    }

    .simpread-upgrade-root.open {
      background-color: rgba(51, 51, 51, .8)
    }

    .simpread-upgrade-root dialog-gp {
      position: relative
    }

    .simpread-upgrade-root dialog-gp .close {
      position: fixed;
      top: 0;
      right: 0;
      z-index: 2
    }

    .simpread-upgrade-root dialog-gp .close:hover {
      -webkit-transform: rotate(270deg);
      transform: rotate(270deg);
      -webkit-transition: all .25s ease-out;
      transition: all .25s ease-out
    }

    .simpread-upgrade-root dialog-content {
      padding-bottom: 80px !important;
      overflow-y: hidden
    }

    .simpread-upgrade-root dialog-content:hover {
      overflow-y: overlay
    }

    .simpread-upgrade-root dialog-content::-webkit-scrollbar-track {
      background-color: transparent
    }

    .simpread-upgrade-root dialog-content::-webkit-scrollbar {
      width: 12px
    }

    .simpread-upgrade-root dialog-content::-webkit-scrollbar-thumb {
      background-clip: padding-box;
      padding-top: 80px;
      background-color: #ddd;
      border: 3px solid transparent;
      border-radius: 8px
    }

    .simpread-upgrade-root .floating {
      position: absolute;
      left: 0;
      right: 0;
      bottom: 0;
      height: 80px;
      overflow-y: hidden
    }

    .simpread-upgrade-root .floating,
    .simpread-upgrade-root .floating .billing {
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-pack: center;
      -ms-flex-pack: center;
      justify-content: center;
      -webkit-box-align: center;
      -ms-flex-align: center;
      align-items: center
    }

    .simpread-upgrade-root .floating .billing {
      -webkit-box-orient: vertical;
      -webkit-box-direction: normal;
      -ms-flex-direction: column;
      flex-direction: column;
      padding: 1px 40px;
      color: #fff;
      background-color: #4dbb7c;
      font-size: 15px;
      font-weight: 400;
      opacity: 0;
      border-radius: 30px;
      -webkit-transition: all .5s cubic-bezier(.23, 1, .32, 1) 0ms;
      transition: all .5s cubic-bezier(.23, 1, .32, 1) 0ms;
      box-shadow: 0 12px 18px -6px rgba(0, 0, 0, .3)
    }

    .simpread-upgrade-root .floating .billing.open {
      -webkit-animation-name: fadeInUp;
      animation-name: fadeInUp;
      -webkit-animation-duration: .3s;
      animation-duration: .3s;
      -webkit-animation-fill-mode: both;
      animation-fill-mode: both
    }

    .simpread-upgrade-root .floating .billing .sales {
      font-size: 12px
    }

    .simpread-upgrade-root .floating .billing .rate {
      margin: 0 5px
    }

    .simpread-upgrade-root .floating .billing .price {
      margin-left: 2px;
      margin-right: 5px
    }

    .upgrade {
      position: relative;
      color: rgba(51, 51, 51, .87);
      font-family: Hiragino Sans GB, Microsoft Yahei;
      text-shadow: none
    }

    .upgrade .head {
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-orient: vertical;
      -webkit-box-direction: normal;
      -ms-flex-direction: column;
      flex-direction: column;
      -webkit-box-align: center;
      -ms-flex-align: center;
      align-items: center
    }

    .upgrade .head img {
      margin-bottom: 5px;
      width: 60px;
      border-radius: 9px;
      box-shadow: 0 12px 18px -6px rgba(0, 0, 0, .3)
    }

    .upgrade .head .title {
      margin: 10px 0;
      font-weight: 700;
      font-size: 15px
    }

    .upgrade .head .desc {
      width: 70%;
      text-align: center;
      font-size: 13px
    }

    .upgrade .features {
      position: relative;
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-orient: horizontal;
      -webkit-box-direction: normal;
      -ms-flex-direction: row;
      flex-direction: row;
      -ms-flex-pack: distribute;
      justify-content: space-around;
      -webkit-transition: height .2s cubic-bezier(.23, 1, .32, 1) 0ms;
      transition: height .2s cubic-bezier(.23, 1, .32, 1) 0ms
    }

    .upgrade .features.init {
      height: 100px
    }

    .upgrade .features.init .base,
    .upgrade .features.init .pro {
      opacity: 0
    }

    .upgrade .loading {
      position: absolute;
      left: 0;
      top: 0;
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-pack: center;
      -ms-flex-pack: center;
      justify-content: center;
      -webkit-box-align: center;
      -ms-flex-align: center;
      align-items: center;
      width: 100%;
      height: 100%;
      background-color: #fff;
      z-index: 1
    }

    .upgrade .loading span {
      width: 50px;
      height: 50px;
      opacity: .87
    }

    .features.error {
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-orient: vertical;
      -webkit-box-direction: normal;
      -ms-flex-direction: column;
      flex-direction: column;
      -webkit-box-pack: center;
      -ms-flex-pack: center;
      justify-content: center;
      -webkit-box-align: center;
      -ms-flex-align: center;
      align-items: center;
      color: inherit;
      font-size: 14px
    }

    .features.error img {
      margin: 10px 0;
      width: 300px
    }

    .upgrade .base,
    .upgrade .pro {
      margin: 20px 20px 13px;
      width: 100%;
      text-align: center;
      opacity: 1;
      -webkit-transition: opacity .2s cubic-bezier(.23, 1, .32, 1) 0ms;
      transition: opacity .2s cubic-bezier(.23, 1, .32, 1) 0ms
    }

    .upgrade .pricecard {
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-orient: vertical;
      -webkit-box-direction: normal;
      -ms-flex-direction: column;
      flex-direction: column;
      border-radius: 4px;
      border: 1px solid #eef1f4;
      position: relative
    }

    .upgrade .pro .pricecard {
      border: 2px solid #4dbb7c;
      box-shadow: 0 12px 18px -6px rgba(0, 0, 0, .3)
    }

    .upgrade .pricecard .mode {
      margin: 20px 10px 10px;
      font-size: 18px;
      font-weight: 700
    }

    .upgrade .pricecard .sales {
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-orient: vertical;
      -webkit-box-direction: normal;
      -ms-flex-direction: column;
      flex-direction: column;
      height: 92px;
      -webkit-box-pack: center;
      -ms-flex-pack: center;
      justify-content: center
    }

    .upgrade .pricecard .discountrate {
      position: absolute;
      top: -12px;
      left: 0;
      right: 0
    }

    .upgrade .pricecard .discountrate .rate {
      padding: 3px 10px;
      color: #fff;
      background-color: #4dbb7c;
      font-weight: 700;
      font-size: 13px;
      border-radius: 10px
    }

    .upgrade .pricecard .desc {
      font-size: 30px
    }

    .upgrade .pricecard .desc del {
      font-size: 15px;
      font-weight: 700;
      text-decoration: line-through
    }

    .upgrade .pricecard .price {
      position: relative;
      color: #4dbb7c;
      font-size: 30px;
      font-weight: 700
    }

    .upgrade .pricecard .message {
      position: relative;
      font-size: 11px;
      font-weight: 400;
      background-image: -webkit-linear-gradient(top, hsla(0, 0%, 100%, 0) 50%, #ffeb3b 0);
      background-image: linear-gradient(180deg, hsla(0, 0%, 100%, 0) 50%, #ffeb3b 0)
    }

    .upgrade .pricecard .countdown {
      margin-top: 5px
    }

    .upgrade .pricecard .billing {
      position: relative;
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-pack: center;
      -ms-flex-pack: center;
      justify-content: center;
      -webkit-box-align: center;
      -ms-flex-align: center;
      align-items: center;
      margin: 30px 20%;
      padding: 5px;
      color: #333;
      background-color: #e2e2e2;
      font-size: 15px;
      font-style: normal;
      font-weight: 700;
      border-radius: 4px;
      cursor: pointer
    }

    .upgrade .pricecard .billing,
    .upgrade .pricecard .billing i {
      -webkit-transition: all .5s cubic-bezier(.23, 1, .32, 1) 0ms;
      transition: all .5s cubic-bezier(.23, 1, .32, 1) 0ms
    }

    .upgrade .pricecard .billing i {
      height: 27px;
      line-height: 22px;
      margin-left: 5px
    }

    .upgrade .pricecard .billing:hover {
      box-shadow: 0 3px 1px -2px rgba(0, 0, 0, .2), 0 2px 2px 0 rgba(0, 0, 0, .14), 0 1px 5px 0 rgba(0, 0, 0, .12)
    }

    .upgrade .pricecard .billing:hover i {
      -webkit-transform: rotate(180deg);
      transform: rotate(180deg)
    }

    .upgrade .pricecard .billing:hover .dropdown-price {
      opacity: 1;
      -webkit-transform: scale(1);
      transform: scale(1)
    }

    .upgrade .pricecard .billing .dropdown-price {
      position: absolute;
      left: -41px;
      top: 38px;
      -webkit-box-orient: vertical;
      -ms-flex-direction: column;
      flex-direction: column;
      -webkit-box-pack: center;
      -ms-flex-pack: center;
      justify-content: center;
      width: 270px;
      color: rgba(51, 51, 51, .87);
      font-size: 12px;
      text-shadow: none;
      box-sizing: border-box;
      border-radius: 4px;
      box-shadow: 0 8px 10px 1px rgba(0, 0, 0, .14), 0 3px 14px 2px rgba(0, 0, 0, .12), 0 5px 5px -3px rgba(0, 0, 0, .2);
      opacity: 0;
      -webkit-transform: scaleY(0);
      transform: scaleY(0);
      -webkit-transform-origin: left top 0;
      transform-origin: left top 0;
      -webkit-transition: opacity 1s cubic-bezier(.23, 1, .32, 1) 0ms, -webkit-transform .45s cubic-bezier(.23, 1, .32, 1) 0ms;
      transition: opacity 1s cubic-bezier(.23, 1, .32, 1) 0ms, -webkit-transform .45s cubic-bezier(.23, 1, .32, 1) 0ms;
      transition: transform .45s cubic-bezier(.23, 1, .32, 1) 0ms, opacity 1s cubic-bezier(.23, 1, .32, 1) 0ms;
      transition: transform .45s cubic-bezier(.23, 1, .32, 1) 0ms, opacity 1s cubic-bezier(.23, 1, .32, 1) 0ms, -webkit-transform .45s cubic-bezier(.23, 1, .32, 1) 0ms;
      z-index: 1
    }

    .upgrade .pricecard .billing .dropdown-price,
    .upgrade .pricecard .billing .dropdown-price .store {
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-direction: normal;
      -webkit-box-align: center;
      -ms-flex-align: center;
      align-items: center;
      background-color: #fff
    }

    .upgrade .pricecard .billing .dropdown-price .store {
      -webkit-box-orient: horizontal;
      -ms-flex-direction: row;
      flex-direction: row;
      padding: 8px 24px 8px 16px;
      width: 100%;
      -webkit-transition: all 1s cubic-bezier(.23, 1, .32, 1) 0ms;
      transition: all 1s cubic-bezier(.23, 1, .32, 1) 0ms;
      cursor: pointer
    }

    .upgrade .pricecard .billing .dropdown-price .store:hover {
      background-color: #eee
    }

    .upgrade .pricecard .billing .dropdown-price .store:hover i {
      -webkit-transform: rotate(270deg) translateY(7px);
      transform: rotate(270deg) translateY(7px)
    }

    .upgrade .pricecard .billing .dropdown-price .store .names {
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-orient: vertical;
      -webkit-box-direction: normal;
      -ms-flex-direction: column;
      flex-direction: column;
      -webkit-box-align: start;
      -ms-flex-align: start;
      align-items: flex-start;
      width: 135px
    }

    .upgrade .pricecard .billing .dropdown-price .store .des {
      width: 100%;
      color: rgba(51, 51, 51, .56);
      text-align: left;
      font-size: 10px;
      -webkit-transform: scale(.8) translateX(-17px);
      transform: scale(.8) translateX(-17px)
    }

    .upgrade .pricecard .billing .dropdown-price .store .num {
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-orient: vertical;
      -webkit-box-direction: normal;
      -ms-flex-direction: column;
      flex-direction: column;
      width: 46px
    }

    .upgrade .pricecard .billing .dropdown-price .store .tips {
      -webkit-transform: scale(.8);
      transform: scale(.8);
      color: #4dbb7c
    }

    .upgrade .pricecard .billing .dropdown-price .store i {
      -webkit-transform: rotate(270deg);
      transform: rotate(270deg)
    }

    .upgrade .base[data-enable=false] .pricecard,
    .upgrade .pro[data-enable=true] .pricecard {
      -webkit-box-pack: center;
      -ms-flex-pack: center;
      justify-content: center;
      height: 210px
    }

    .upgrade .base[data-enable=false] .pricecard .mode,
    .upgrade .pro[data-enable=true] .pricecard .mode {
      font-size: 25px
    }

    .upgrade .base[data-enable=false] .pricecard .billing,
    .upgrade .base[data-enable=false] .pricecard .sales,
    .upgrade .pro[data-enable=true] .pricecard .billing .dropdown-price,
    .upgrade .pro[data-enable=true] .pricecard .billing i,
    .upgrade .pro[data-enable=true] .pricecard .discountrate,
    .upgrade .pro[data-enable=true] .pricecard .sales {
      display: none
    }

    .upgrade .pro[data-enable=true] .pricecard .billing {
      position: absolute;
      top: -28px;
      left: 0;
      right: 0;
      display: inherit;
      margin: 10px 20%;
      border-radius: 30px
    }

    .upgrade .pro .billing {
      color: #fff;
      background-color: #4dbb7c
    }

    .upgrade .features.diff {
      -webkit-box-orient: vertical;
      -ms-flex-direction: column;
      flex-direction: column;
      margin-top: 20px
    }

    .upgrade .features.diff,
    .upgrade .features .feature {
      -webkit-box-direction: normal;
      -webkit-box-align: center;
      -ms-flex-align: center;
      align-items: center
    }

    .upgrade .features .feature {
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-orient: horizontal;
      -ms-flex-direction: row;
      flex-direction: row;
      -webkit-box-pack: unset;
      -ms-flex-pack: unset;
      justify-content: unset;
      margin: 14px 20px 0;
      font-size: 15px
    }

    .upgrade .features .feature.empty {
      height: 27px
    }

    .upgrade .features .icon {
      margin-right: 10px;
      width: 15px
    }

    .upgrade .features .label {
      width: 120px;
      font-size: 15px;
      text-align: left
    }

    .upgrade .features a {
      color: inherit;
      cursor: auto
    }

    .upgrade .features a.active {
      padding-bottom: 5px;
      border-bottom: 1px dotted;
      -webkit-transition: all .5s cubic-bezier(.23, 1, .32, 1) 0ms;
      transition: all .5s cubic-bezier(.23, 1, .32, 1) 0ms;
      cursor: pointer
    }

    .upgrade .features a.active:hover {
      color: #4285f4
    }

    .upgrade .features .label .remark {
      margin-left: 5px;
      padding: 2px 5px;
      background-color: #ffeb3b;
      font-size: 12px;
      font-weight: 400;
      border-radius: 4px
    }

    .upgrade .features .label .remark.roadmap {
      background-color: #e2e2e2
    }

    .upgrade .ticket {
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-orient: vertical;
      -webkit-box-direction: normal;
      -ms-flex-direction: column;
      flex-direction: column;
      -webkit-box-align: center;
      -ms-flex-align: center;
      align-items: center;
      -webkit-box-pack: center;
      -ms-flex-pack: center;
      justify-content: center;
      font-size: 13px
    }

    .upgrade .ticket .message {
      width: 70%;
      text-align: center
    }

    .upgrade .ticket .line {
      margin: 7px 0 0;
      width: 100%;
      height: 1px;
      background-image: -webkit-linear-gradient(.1deg, rgba(255, 18, 18, 0) -2.8%, #e2e2e2 50.8%, rgba(0, 159, 8, 0) 107.9%);
      background-image: linear-gradient(89.9deg, rgba(255, 18, 18, 0) -2.8%, #e2e2e2 50.8%, rgba(0, 159, 8, 0) 107.9%)
    }

    .upgrade .ticket .notice {
      margin: 20px 20%;
      padding: 5px 20px;
      color: #333;
      background-color: #e2e2e2;
      font-size: 15px;
      font-weight: 400;
      border-radius: 4px
    }

    .upgrade .ticket .content {
      margin: 0 0 13px;
      width: 80%
    }

    .upgrade .ticket .content li {
      margin-bottom: 6px
    }

    .upgrade .ticket .content li:last-child {
      margin-bottom: 0
    }

    .upgrade .ticket .last {
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -ms-flex-pack: distribute;
      justify-content: space-around;
      -webkit-box-align: center;
      -ms-flex-align: center;
      align-items: center;
      margin: 20px 0;
      width: 100%
    }

    .upgrade .carousels {
      margin: 20px 20px 13px
    }

    .upgrade .carousel.carousel-slider {
      height: 420px;
      border-radius: 4px;
      box-shadow: 0 12px 18px -6px rgba(0, 0, 0, .3)
    }

    .upgrade .carousels setion {
      position: relative
    }

    .upgrade .carousels setion img {
      margin-top: -82px;
      width: 100%
    }

    .upgrade .carousels .descr {
      position: absolute;
      left: 0;
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-orient: vertical;
      -webkit-box-direction: normal;
      -ms-flex-direction: column;
      flex-direction: column;
      -webkit-box-pack: center;
      -ms-flex-pack: center;
      justify-content: center;
      -webkit-box-align: center;
      -ms-flex-align: center;
      align-items: center;
      height: 80px;
      width: 100%;
      padding-bottom: 10px;
      background-color: #fff;
      font-size: 17px
    }

    .simpread-upgrade-root.mini dialog-gp {
      border-radius: 15px !important
    }

    .simpread-upgrade-root.mini dialog-content {
      padding: 0 !important;
      width: 650px !important
    }

    .simpread-upgrade-root.mini dialog-gp .close {
      position: absolute
    }

    .simpread-upgrade-root.mini .upgrade .carousels {
      margin: 0
    }

    .simpread-upgrade-root.mini .upgrade .carousels .descr {
      padding-bottom: 70px;
      height: 130px
    }

    .simpread-upgrade-root.mini .upgrade .carousel.carousel-slider {
      height: 450px
    }

    .simpread-upgrade-root.mini .floating .billing {
      margin-bottom: 30px;
      min-height: 40px
    }

    .simpread-upgrade-root.mini footer {
      position: absolute;
      top: 199px;
      left: -60px;
      right: -60px;
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-orient: horizontal;
      -webkit-box-direction: normal;
      -ms-flex-direction: row;
      flex-direction: row;
      -webkit-box-pack: justify;
      -ms-flex-pack: justify;
      justify-content: space-between;
      -webkit-box-align: center;
      -ms-flex-align: center;
      align-items: center
    }
  </style>
  <style type="text/css">
    :root {
      --sr-annote-color-0: #b4d9fb;
      --sr-annote-color-1: #ffeb3b;
      --sr-annote-color-2: #a2e9f2;
      --sr-annote-color-3: #a1e0ff;
      --sr-annote-color-4: #a8ea68;
      --sr-annote-color-5: #ffb7da
    }

    [sr-annote-bg-color] {
      color: inherit
    }

    [sr-annote-bg-color][data-color-type="0"] {
      background-color: var(--sr-annote-color-0)
    }

    [sr-annote-bg-color][data-color-type="1"] {
      background-color: var(--sr-annote-color-1)
    }

    [sr-annote-bg-color][data-color-type="2"] {
      background-color: var(--sr-annote-color-2)
    }

    [sr-annote-bg-color][data-color-type="3"] {
      background-color: var(--sr-annote-color-3)
    }

    [sr-annote-bg-color][data-color-type="4"] {
      background-color: var(--sr-annote-color-4)
    }

    [sr-annote-bg-color][data-color-type="5"] {
      background-color: var(--sr-annote-color-5)
    }

    [sr-annote-bb-color][data-color-type="1"] {
      border-bottom-color: var(--sr-annote-color-1)
    }

    [sr-annote-bb-color][data-color-type="2"] {
      border-bottom-color: var(--sr-annote-color-2)
    }

    [sr-annote-bb-color][data-color-type="3"] {
      border-bottom-color: var(--sr-annote-color-3)
    }

    [sr-annote-bb-color][data-color-type="4"] {
      border-bottom-color: var(--sr-annote-color-4)
    }

    [sr-annote-bb-color][data-color-type="5"] {
      border-bottom-color: var(--sr-annote-color-5)
    }

    [sr-annote-bl-color][data-color-type="1"] {
      border-left: 5px solid var(--sr-annote-color-1)
    }

    [sr-annote-bl-color][data-color-type="2"] {
      border-left: 5px solid var(--sr-annote-color-2)
    }

    [sr-annote-bl-color][data-color-type="3"] {
      border-left: 5px solid var(--sr-annote-color-3)
    }

    [sr-annote-bl-color][data-color-type="4"] {
      border-left: 5px solid var(--sr-annote-color-4)
    }

    [sr-annote-bl-color][data-color-type="5"] {
      border-left: 5px solid var(--sr-annote-color-5)
    }

    [data-color-style="1"] {
      background-color: transparent !important;
      background-repeat: no-repeat;
      background-size: 100% 100%
    }

    [data-color-style="1"][data-color-type="1"] {
      background-color: transparent !important;
      background-image: url()
    }

    [data-color-style="1"][data-color-type="2"] {
      background-color: transparent !important;
      background-image: url()
    }

    [data-color-style="1"][data-color-type="3"] {
      background-color: transparent !important;
      background-image: url()
    }

    [data-color-style="1"][data-color-type="4"] {
      background-color: transparent !important;
      background-image: url()
    }

    [data-color-style="1"][data-color-type="5"] {
      background-color: transparent !important;
      background-image: url()
    }

    [data-color-style="2"] {
      background-color: transparent !important
    }

    [data-color-style="2"][data-color-type="1"] {
      background-color: transparent !important;
      background-image: linear-gradient(180deg, hsla(0, 0%, 100%, 0) 50%, var(--sr-annote-color-1) 0)
    }

    [data-color-style="2"][data-color-type="2"] {
      background-color: transparent !important;
      background-image: linear-gradient(180deg, hsla(0, 0%, 100%, 0) 50%, var(--sr-annote-color-2) 0)
    }

    [data-color-style="2"][data-color-type="3"] {
      background-color: transparent !important;
      background-image: linear-gradient(180deg, hsla(0, 0%, 100%, 0) 50%, var(--sr-annote-color-3) 0)
    }

    [data-color-style="2"][data-color-type="4"] {
      background-color: transparent !important;
      background-image: linear-gradient(180deg, hsla(0, 0%, 100%, 0) 50%, var(--sr-annote-color-4) 0)
    }

    [data-color-style="2"][data-color-type="5"] {
      background-color: transparent !important;
      background-image: linear-gradient(180deg, hsla(0, 0%, 100%, 0) 50%, var(--sr-annote-color-5) 0)
    }

    [data-color-style="3"] {
      position: relative;
      background-color: transparent !important
    }

    [data-color-style="3"]:after {
      content: "";
      position: absolute;
      left: 0;
      bottom: 25px;
      height: 8px;
      width: 58px;
      border-radius: 4px;
      opacity: .8;
      transition: all .3s
    }

    [data-color-style="3"][data-color-type="1"] {
      background-color: transparent !important;
      background-image: linear-gradient(180deg, hsla(0, 0%, 100%, 0) 85%, var(--sr-annote-color-1) 0)
    }

    [data-color-style="3"][data-color-type="2"] {
      background-color: transparent !important;
      background-image: linear-gradient(180deg, hsla(0, 0%, 100%, 0) 85%, var(--sr-annote-color-2) 0)
    }

    [data-color-style="3"][data-color-type="3"] {
      background-color: transparent !important;
      background-image: linear-gradient(180deg, hsla(0, 0%, 100%, 0) 85%, var(--sr-annote-color-3) 0)
    }

    [data-color-style="3"][data-color-type="4"] {
      background-color: transparent !important;
      background-image: linear-gradient(180deg, hsla(0, 0%, 100%, 0) 85%, var(--sr-annote-color-4) 0)
    }

    [data-color-style="3"][data-color-type="5"] {
      background-color: transparent !important;
      background-image: linear-gradient(180deg, hsla(0, 0%, 100%, 0) 85%, var(--sr-annote-color-5) 0)
    }

    sr-annote-note {
      position: relative;
      bottom: -5px;
      padding: 0 4px;
      color: #fff;
      background-color: #333;
      font-weight: 700;
      font-style: normal;
      font-family: arial, helvetica, clean, sans-serif;
      border-radius: 5px;
      opacity: .8;
      cursor: pointer
    }

    sr-annote-note:after {
      content: "N"
    }

    pre.sr-annote+sr-annote-note {
      bottom: 25px;
      right: 25px
    }

    sr-annote-note:hover {
      opacity: 1
    }

    sr-annote-note sr-annote-note-tip {
      position: absolute;
      left: 0;
      top: 0;
      padding: .5em 1em;
      max-width: 400px;
      color: #fff;
      background: #101010;
      font-family: -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Oxygen, Ubuntu, Cantarell, Open Sans, Helvetica Neue, sans-serif;
      font-weight: 400;
      font-style: normal;
      text-shadow: none;
      font-size: 12px;
      text-indent: 0;
      white-space: pre;
      z-index: 10;
      border-radius: 5px;
      box-shadow: 0 0 10px rgba(0, 0, 0, .3);
      opacity: 0;
      overflow: auto;
      pointer-events: none;
      z-index: 20000;
      transition: all .18s ease-out .18s
    }

    sr-annote-note:hover sr-annote-note-tip {
      opacity: 1;
      pointer-events: auto
    }

    sr-annote-note sr-annote-note-tip {
      overflow: hidden
    }

    sr-annote-note sr-annote-note-tip:hover {
      overflow: overlay
    }

    sr-annote-note sr-annote-note-tip::-webkit-scrollbar-track {
      background-color: transparent
    }

    sr-annote-note sr-annote-note-tip::-webkit-scrollbar {
      width: 12px
    }

    sr-annote-note sr-annote-note-tip::-webkit-scrollbar-thumb {
      background-clip: padding-box;
      padding-top: 80px;
      background-color: #ddd;
      border: 3px solid transparent;
      border-radius: 8px
    }
  </style>
  <style type="text/css">
    .sr-annote-hideall {
      background-color: transparent !important;
      pointer-events: none
    }

    sr-annote-trigger {
      position: fixed !important;
      bottom: 52px;
      right: 32px;
      display: -webkit-box !important;
      display: -ms-flexbox !important;
      display: flex !important;
      -webkit-box-pack: center;
      -ms-flex-pack: center;
      justify-content: center;
      -webkit-box-align: center;
      -ms-flex-align: center;
      align-items: center;
      margin: 0 0 15px;
      padding: 0;
      width: 40px !important;
      height: 40px !important;
      line-height: 40px !important;
      color: #fff;
      background-color: rgba(245, 82, 70, .8);
      border-radius: 50%;
      cursor: pointer;
      box-shadow: 0 2px 2px 0 rgba(0, 0, 0, .14), 0 1px 5px 0 rgba(0, 0, 0, .12), 0 3px 1px -2px rgba(0, 0, 0, .2);
      -webkit-transition: all .5s ease-in-out 0ms;
      transition: all .5s ease-in-out 0ms;
      overflow: visible !important;
      overflow: initial !important
    }

    sr-annote-trigger.open {
      right: 95px
    }

    sr-annote-trigger.off {
      background-color: #bdbdbd
    }

    sr-annote-trigger sr-i {
      display: -webkit-box !important;
      display: -ms-flexbox !important;
      display: flex !important;
      -webkit-box-pack: center;
      -ms-flex-pack: center;
      justify-content: center;
      -webkit-box-align: center;
      -ms-flex-align: center;
      align-items: center;
      width: 100%;
      height: 100%;
      border-radius: 50%
    }

    sr-annote {
      padding: 6px 0;
      background-color: transparent;
      font-size: inherit;
      cursor: pointer
    }

    .sr-annote[data-type=code],
    .sr-annote[data-type=img] {
      border-bottom-width: 5px;
      border-bottom-style: solid
    }

    sr-annote[data-color-type="0"] {
      padding: 7px 0
    }

    sr-annote-floating {
      position: fixed;
      color: #fff;
      background: hsla(0, 0%, 6%, .95);
      font-weight: 700;
      border-radius: 5px;
      box-shadow: 0 0 10px rgba(0, 0, 0, .3);
      opacity: 0;
      -webkit-animation-delay: .2s;
      animation-delay: .2s;
      -webkit-animation-duration: .5s;
      animation-duration: .5s;
      -webkit-animation-fill-mode: both;
      animation-fill-mode: both;
      -webkit-animation-name: sr-annote-slideInUp;
      animation-name: sr-annote-slideInUp;
      z-index: 2000
    }

    sr-annote-floating.fast {
      -webkit-animation-duration: .2s !important;
      animation-duration: .2s !important
    }

    sr-annote-floating.effect {
      -webkit-transition: all 1s cubic-bezier(.23, 1, .32, 1) .1s;
      transition: all 1s cubic-bezier(.23, 1, .32, 1) .1s
    }

    sr-annote-floating.hidden {
      -webkit-animation-duration: .5s;
      animation-duration: .5s;
      -webkit-animation-fill-mode: both;
      animation-fill-mode: both;
      -webkit-animation-name: sr-annote-slideInDown;
      animation-name: sr-annote-slideInDown;
      pointer-events: none
    }

    .sr-annote-floatingbar-hiden {
      display: none
    }

    @-webkit-keyframes sr-annote-slideInUp {
      0% {
        opacity: 0;
        -webkit-transform: translate3d(0, 100%, 0);
        transform: translate3d(0, 100%, 0);
        visibility: visible
      }

      to {
        opacity: 1;
        -webkit-transform: translateZ(0);
        transform: translateZ(0)
      }
    }

    @keyframes sr-annote-slideInUp {
      0% {
        opacity: 0;
        -webkit-transform: translate3d(0, 100%, 0);
        transform: translate3d(0, 100%, 0);
        visibility: visible
      }

      to {
        opacity: 1;
        -webkit-transform: translateZ(0);
        transform: translateZ(0)
      }
    }

    @-webkit-keyframes sr-annote-slideInDown {
      0% {
        opacity: 1;
        visibility: visible
      }

      to {
        opacity: 0;
        -webkit-transform: translate3d(0, 100%, 0);
        transform: translate3d(0, 100%, 0)
      }
    }

    @keyframes sr-annote-slideInDown {
      0% {
        opacity: 1;
        visibility: visible
      }

      to {
        opacity: 0;
        -webkit-transform: translate3d(0, 100%, 0);
        transform: translate3d(0, 100%, 0)
      }
    }

    sr-annote-floatingbar {
      -webkit-box-orient: horizontal;
      -webkit-box-direction: normal;
      -ms-flex-direction: row;
      flex-direction: row;
      margin: 5px
    }

    sr-annote-floatingbar,
    sr-annote-floatingbar sr-anote-fb-item {
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-pack: center;
      -ms-flex-pack: center;
      justify-content: center;
      -webkit-box-align: center;
      -ms-flex-align: center;
      align-items: center
    }

    sr-annote-floatingbar sr-anote-fb-item {
      margin-right: 5px;
      cursor: pointer
    }

    sr-annote-floatingbar sr-anote-fb-item:last-child {
      margin-right: 0
    }

    sr-annote-floatingbar sr-anote-fb-item {
      width: 20px;
      height: 20px;
      border-radius: 50%;
      box-sizing: border-box
    }

    sr-annote-floatingbar sr-anote-fb-item[type=copy],
    sr-annote-floatingbar sr-anote-fb-item[type=export],
    sr-annote-floatingbar sr-anote-fb-item[type=link],
    sr-annote-floatingbar sr-anote-fb-item[type=note],
    sr-annote-floatingbar sr-anote-fb-item[type=remove],
    sr-annote-floatingbar sr-anote-fb-item[type=style],
    sr-annote-floatingbar sr-anote-fb-item[type=tag] {
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-pack: center;
      -ms-flex-pack: center;
      justify-content: center;
      -webkit-box-align: center;
      -ms-flex-align: center;
      align-items: center;
      background-color: #fff;
      border-radius: 50%
    }

    sr-annote-floatingbar sr-anote-fb-item[type=style] {
      background-color: #f73859 !important
    }

    sr-annote-floatingbar sr-anote-fb-item[type=export] {
      background-color: #cc0e74
    }

    sr-annote-floatingbar sr-anote-fb-item[type=copy] {
      background-color: #a78674
    }

    sr-annote-floatingbar sr-anote-fb-item[type=link] {
      background-color: #7f39fb
    }

    sr-annote-floatingbar sr-anote-fb-item[type=remove] {
      background-color: #f44336
    }

    sr-annote-floatingbar sr-anote-fb-item[remove=confirm] {
      -webkit-transform: rotate(270deg);
      transform: rotate(270deg);
      -webkit-transition: all .2s ease-in-out 0s;
      transition: all .2s ease-in-out 0s
    }

    sr-annote-sidebar-bg {
      position: fixed;
      top: 0;
      right: 0;
      bottom: 180px;
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-orient: vertical;
      -webkit-box-direction: normal;
      -ms-flex-direction: column;
      flex-direction: column;
      width: 260px;
      font-size: 22.4px;
      font-size: 1.4rem;
      font-weight: 500;
      opacity: 0;
      -webkit-transform: translateX(256px);
      transform: translateX(256px);
      -webkit-transition: all .45s cubic-bezier(.23, 1, .32, 1) 0ms;
      transition: all .45s cubic-bezier(.23, 1, .32, 1) 0ms
    }

    sr-annote-sidebar-bg.mini {
      pointer-events: none
    }

    sr-annote-sidebar-bg:hover {
      z-index: 2147483647
    }

    sr-annote-sidebar-bg.open {
      opacity: 1;
      -webkit-transform: translateX(0);
      transform: translateX(0)
    }

    sr-annote-sidebar {
      margin: 3px 4px 0;
      padding-left: 20px;
      height: 100%;
      overflow-x: hidden
    }

    sr-annote-sidebar.mini {
      pointer-events: none
    }

    sr-annote-sidebar * {
      color: rgba(0, 0, 0, .6);
      word-break: break-all;
      box-sizing: border-box
    }

    sr-annote-sidebar {
      overflow-y: hidden
    }

    sr-annote-sidebar:hover {
      overflow-y: overlay
    }

    sr-annote-sidebar::-webkit-scrollbar-track {
      background-color: transparent
    }

    sr-annote-sidebar::-webkit-scrollbar {
      width: 12px
    }

    sr-annote-sidebar::-webkit-scrollbar-thumb {
      padding-top: 80px;
      background-clip: padding-box;
      background-color: #ddd;
      border: 3px solid transparent;
      border-radius: 8px;
      border-radius: 10px;
      border: 6px solid transparent;
      background-color: rgba(85, 85, 85, .55)
    }

    sr-annote-sidebar::-webkit-scrollbar {
      width: 0;
      -webkit-transition: width .7s cubic-bezier(.4, 0, .2, 1);
      transition: width .7s cubic-bezier(.4, 0, .2, 1)
    }

    sr-annote-sidebar:hover::-webkit-scrollbar {
      width: 16px
    }

    sr-annote-sidebar[srcoll=on]:hover sr-annote-sidebar-card[type=option].mini {
      -webkit-transform: translateX(-16px);
      transform: translateX(-16px)
    }

    sr-annote-sidebar[srcoll=on]:hover sr-annote-sidebar-card.off {
      -webkit-transform: translateX(190px);
      transform: translateX(190px)
    }

    sr-annote-sidebar-cards {
      display: block
    }

    sr-annote-sidebar-card {
      position: relative;
      display: block !important;
      margin: 12px 7px 12px 12px;
      color: rgba(51, 51, 51, .87);
      background-color: #fff;
      border-radius: 4px;
      box-shadow: 0 2px 5px rgba(0, 0, 0, .08);
      -webkit-transition: all .45s cubic-bezier(.23, 1, .32, 1) 0ms;
      transition: all .45s cubic-bezier(.23, 1, .32, 1) 0ms;
      pointer-events: auto
    }

    sr-annote-sidebar-card:hover {
      box-shadow: 0 10px 20px 0 rgba(168, 182, 191, .6);
      -webkit-transform: translateY(-1px);
      transform: translateY(-1px)
    }

    sr-annote-sidebar-card:last-child {
      margin-bottom: 30px
    }

    sr-annote-sidebar-card.off {
      display: block;
      -webkit-transform: translateX(210px);
      transform: translateX(210px);
      -webkit-transition: all .25s ease-out;
      transition: all .25s ease-out
    }

    sr-annote-sidebar-card.off:hover {
      -webkit-transform: translateX(120px) !important;
      transform: translateX(120px) !important
    }

    sr-annote-sidebar-card.hide {
      display: block;
      -webkit-transform: translateX(256px);
      transform: translateX(256px);
      -webkit-transition: all .25s ease-out;
      transition: all .25s ease-out
    }

    sr-annote-sidebar-card-anchor {
      position: absolute;
      left: 0;
      top: 0;
      width: 90%;
      height: 100%
    }

    sr-annote-sidebar-card-action {
      position: absolute;
      top: 10px;
      right: 3px;
      display: block;
      width: 12px;
      height: 12px;
      line-height: 12px;
      -webkit-transition: all .25s ease-out;
      transition: all .25s ease-out;
      cursor: pointer;
      z-index: 20000
    }

    sr-annote-sidebar-card-action.open {
      -webkit-transform: rotate(90deg);
      transform: rotate(90deg)
    }

    sr-annote-sidebar-card[mode=mini] {
      overflow: hidden
    }

    sr-annote-sidebar-card[mode=mini] sr-annote-sidebar-preview {
      display: block;
      padding: 6px 12px 5px 10px;
      height: 32px;
      font-size: 13px;
      font-weight: 400;
      white-space: nowrap;
      text-align: left;
      text-overflow: ellipsis;
      -webkit-transition: all .25s ease-out;
      transition: all .25s ease-out;
      overflow: hidden
    }

    sr-annote-sidebar-card[mode=mini][type=img] sr-annote-sidebar-preview {
      text-align: center
    }

    sr-annote-sidebar-card[mode=mini] sr-annote-sidebar-detail {
      padding: 0 15px;
      height: 0
    }

    sr-annote-sidebar-card[mode=mini] sr-annote-sidebar-note,
    sr-annote-sidebar-card[mode=mini] sr-annote-sidebar-toolbars {
      display: none
    }

    sr-annote-sidebar-card[mode=mini] pre {
      margin: 0 !important;
      padding: 0 !important;
      white-space: nowrap;
      text-overflow: ellipsis;
      overflow: hidden
    }

    sr-annote-sidebar-card[mode=normal] sr-annote-sidebar-preview {
      display: none
    }

    sr-annote-sidebar-card[mode=normal] sr-annote-sidebar-detail {
      margin-bottom: 15px;
      padding: 15px 15px 0;
      height: auto;
      overflow: hidden;
      text-overflow: ellipsis;
      display: -webkit-box;
      -webkit-line-clamp: 3;
      -webkit-box-orient: vertical
    }

    sr-annote-sidebar-card[data-color-type="0"] {
      display: none !important
    }

    sr-annote-sidebar-card pre {
      margin: 0 !important;
      padding: 0 !important;
      background-color: transparent !important;
      max-height: 200px;
      font-size: 10px;
      overflow: hidden
    }

    sr-annote-sidebar-card input,
    sr-annote-sidebar-card textarea {
      font-size: 12px !important
    }

    sr-annote-sidebar-card img {
      margin: 0;
      padding: 0;
      max-height: 100px;
      max-width: 80%;
      background: #fff;
      border: 0;
      border-radius: 6px
    }

    sr-annote-sidebar-detail {
      display: block;
      padding: 15px;
      width: 100%;
      color: #fff;
      font-size: 10px;
      text-align: justify;
      border-top-left-radius: 4px;
      border-top-right-radius: 4px;
      -webkit-transition: all .25s ease-out;
      transition: all .25s ease-out
    }

    sr-annote-sidebar-card[type=img] sr-annote-sidebar-detail {
      text-align: center
    }

    sr-annote-sidebar-tags {
      -ms-flex-wrap: wrap;
      flex-wrap: wrap;
      margin-top: 15px
    }

    sr-annote-sidebar-tag,
    sr-annote-sidebar-tags {
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex
    }

    sr-annote-sidebar-tag {
      -webkit-box-orient: horizontal;
      -webkit-box-direction: normal;
      -ms-flex-direction: row;
      flex-direction: row;
      -webkit-box-align: center;
      -ms-flex-align: center;
      align-items: center;
      -webkit-box-pack: end;
      -ms-flex-pack: end;
      justify-content: flex-end;
      padding: 4px 12px 12px 0;
      height: 22px;
      font-size: 14px;
      font-size: .875rem;
      font-weight: 700;
      white-space: nowrap;
      border-radius: 16px;
      outline: none;
      cursor: pointer;
      overflow: hidden;
      -webkit-transition: all .2s ease-in-out 0s;
      transition: all .2s ease-in-out 0s
    }

    sr-annote-sidebar-note {
      display: block;
      padding: 15px 15px 0;
      width: 100%;
      background-color: #fff;
      text-align: justify;
      font-size: 13px;
      overflow: hidden;
      text-overflow: ellipsis;
      display: -webkit-box;
      -webkit-line-clamp: 4;
      -webkit-box-orient: vertical
    }

    sr-annote-sidebar-toolbars {
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-orient: horizontal;
      -webkit-box-direction: normal;
      -ms-flex-direction: row;
      flex-direction: row;
      -webkit-box-pack: end;
      -ms-flex-pack: end;
      justify-content: flex-end;
      padding-right: 10px;
      height: 32px;
      background-color: #fff;
      border-bottom-left-radius: 4px;
      border-bottom-right-radius: 4px
    }

    sr-annote-sidebar-toolbar,
    sr-annote-sidebar-toolbars {
      -webkit-box-align: center;
      -ms-flex-align: center;
      align-items: center
    }

    sr-annote-sidebar-toolbar {
      display: -webkit-box !important;
      display: -ms-flexbox !important;
      display: flex !important;
      -webkit-box-pack: center;
      -ms-flex-pack: center;
      justify-content: center;
      margin-left: 5px;
      width: 20px;
      height: 20px;
      line-height: 20px;
      border-radius: 50%
    }

    sr-annote-sidebar-toolbar[remove=confirm] {
      -webkit-transform: rotate(270deg);
      transform: rotate(270deg);
      -webkit-transition: all .2s ease-in-out 0s;
      transition: all .2s ease-in-out 0s
    }

    sr-annote-sidebar-toolbar[remove=confirm] svg path {
      fill: #f44336
    }

    sr-annote-sidebar-card[type=unread] {
      background-color: #1fab89
    }

    sr-annote-sidebar-card[type=unread] sr-annote-sidebar-detail.title {
      padding: 0;
      text-align: left;
      font-size: 14px
    }

    sr-annote-sidebar-card[type=unread] sr-annote-sidebar-detail.desc {
      padding: 0 0 0 10px;
      overflow: hidden;
      text-overflow: ellipsis;
      display: -webkit-box;
      -webkit-line-clamp: 4;
      -webkit-box-orient: vertical;
      border-left: 1px outset #fff;
      border-top-left-radius: 0;
      border-top-right-radius: 0
    }

    sr-annote-sidebar-card[type=unread] sr-annote-sidebar-tag {
      color: #fff
    }

    sr-annote-sidebar-card[type=unread][mode=mini] sr-annote-sidebar-preview {
      color: #fff;
      font-size: 13px
    }

    sr-annote-sidebar-card[type=option] {
      height: 32px;
      background-color: transparent;
      box-shadow: none;
      overflow: visible;
      overflow: initial
    }

    sr-annote-sidebar-card[type=option]:hover {
      -webkit-transform: translateY(0);
      transform: translateY(0)
    }

    sr-annote-sidebar-card[type=option].mini {
      margin-right: 0
    }

    sr-annote-sidebar-card[type=option] sr-annote-sidebar-card-action,
    sr-annote-sidebar-card[type=option] sr-annote-sidebar-card-anchor {
      display: none
    }

    sr-annote-sidebar-card[type=option] sr-annote-sidebar-preview {
      background-color: transparent
    }

    sr-annote-sidebar-options {
      position: absolute;
      top: 0;
      right: 0;
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-orient: horizontal;
      -webkit-box-direction: normal;
      -ms-flex-direction: row;
      flex-direction: row;
      padding-right: 5px;
      height: 100%;
      background-color: #3a3a3a;
      border-left: 10px outset #222;
      border-radius: 4px
    }

    sr-annote-sidebar-option,
    sr-annote-sidebar-options {
      -webkit-box-pack: center;
      -ms-flex-pack: center;
      justify-content: center;
      -webkit-box-align: center;
      -ms-flex-align: center;
      align-items: center
    }

    sr-annote-sidebar-option {
      display: -webkit-box !important;
      display: -ms-flexbox !important;
      display: flex !important;
      margin-left: 5px;
      width: 20px;
      height: 20px;
      border-radius: 50%;
      -webkit-transition: all .25s ease-out;
      transition: all .25s ease-out;
      cursor: pointer
    }

    sr-annote-sidebar-option[off=true],
    sr-annote-sidebar-option[side=false]:not(:first-child) {
      width: 0;
      margin-left: 0
    }

    sr-annote-sidebar-option[off=true]~sr-annote-sidebar-option:last-child svg {
      -webkit-transform: rotate(180deg);
      transform: rotate(180deg)
    }

    sr-annote-sidebar-option[type=drag][state=on] svg path,
    sr-annote-sidebar-option[type=goon][state=on] svg path,
    sr-annote-sidebar-option[type=save][state=on] svg path {
      fill: #1fab89
    }

    sr-annote-sidebar-option[type=collapse][state=on] svg {
      -webkit-transform: rotate(90deg);
      transform: rotate(90deg)
    }

    sr-annote-sidebar-option[lock=true] svg path {
      fill: #f55246 !important
    }

    sr-annote-sidebar-card[type=option]:hover~sr-annote-sidebar-card[type=unread] {
      z-index: -1
    }
  </style>
  <style type="text/css">
    @-webkit-keyframes fadeInUp {
      0% {
        opacity: 0;
        -webkit-transform: translate3d(0, 100%, 0);
        transform: translate3d(0, 100%, 0)
      }

      to {
        opacity: 1;
        -webkit-transform: translateZ(0);
        transform: translateZ(0)
      }
    }

    @keyframes fadeInUp {
      0% {
        opacity: 0;
        -webkit-transform: translate3d(0, 100%, 0);
        transform: translate3d(0, 100%, 0)
      }

      to {
        opacity: 1;
        -webkit-transform: translateZ(0);
        transform: translateZ(0)
      }
    }

    @-webkit-keyframes fadeOutDown {
      0% {
        opacity: 1;
        -webkit-transform: translateZ(0);
        transform: translateZ(0)
      }

      to {
        opacity: 0;
        -webkit-transform: translate3d(0, 100%, 0);
        transform: translate3d(0, 100%, 0)
      }
    }

    @keyframes fadeOutDown {
      0% {
        opacity: 1;
        -webkit-transform: translateZ(0);
        transform: translateZ(0)
      }

      to {
        opacity: 0;
        -webkit-transform: translate3d(0, 100%, 0);
        transform: translate3d(0, 100%, 0)
      }
    }

    .sr-alertgp {
      position: fixed;
      left: 0;
      top: 0;
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-pack: center;
      -ms-flex-pack: center;
      justify-content: center;
      -webkit-box-align: center;
      -ms-flex-align: center;
      align-items: center;
      width: 100%;
      height: 100%;
      background-color: rgba(51, 51, 51, .8);
      z-index: 2147483647
    }

    .sr-alertgp .alert {
      min-width: 400px;
      min-height: 400px;
      width: 650px;
      background-color: #fff;
      border-radius: 4px;
      box-shadow: 0 14px 45px rgba(0, 0, 0, .247059);
      -webkit-animation-name: fadeInUp;
      animation-name: fadeInUp;
      -webkit-animation-duration: .8s;
      animation-duration: .8s;
      -webkit-animation-fill-mode: both;
      animation-fill-mode: both
    }

    .sr-alertgp .alert,
    .sr-alertgp .alert .loading {
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-orient: vertical;
      -webkit-box-direction: normal;
      -ms-flex-direction: column;
      flex-direction: column;
      -webkit-box-align: center;
      -ms-flex-align: center;
      align-items: center
    }

    .sr-alertgp .alert .loading {
      position: relative;
      -webkit-box-pack: center;
      -ms-flex-pack: center;
      justify-content: center;
      width: 100%;
      height: 35%;
      background-color: transparent
    }

    .alert .loading .progress {
      display: block;
      margin: 10px auto;
      max-width: 80%;
      max-height: 250px;
      width: 20%
    }

    .alert .loading .progress .percentage {
      fill: #666;
      font-family: sans-serif;
      font-size: .5em;
      text-anchor: middle
    }

    .alert .loading .progress .circle-bg {
      fill: none;
      stroke: #eee;
      stroke-width: 3.8
    }

    .alert .loading .progress .circle {
      fill: none;
      stroke-width: 2.8;
      stroke-linecap: round;
      stroke: #1dba90;
      -webkit-transition: all .2s ease-in-out;
      transition: all .2s ease-in-out
    }

    @-webkit-keyframes scaleAnimation {
      0% {
        opacity: 0;
        -webkit-transform: scale(1.5);
        transform: scale(1.5)
      }

      to {
        opacity: 1;
        -webkit-transform: scale(1);
        transform: scale(1)
      }
    }

    @keyframes scaleAnimation {
      0% {
        opacity: 0;
        -webkit-transform: scale(1.5);
        transform: scale(1.5)
      }

      to {
        opacity: 1;
        -webkit-transform: scale(1);
        transform: scale(1)
      }
    }

    @-webkit-keyframes fadeOut {
      0% {
        opacity: 1
      }

      to {
        opacity: 0
      }
    }

    @keyframes fadeOut {
      0% {
        opacity: 1
      }

      to {
        opacity: 0
      }
    }

    @-webkit-keyframes fadeIn {
      0% {
        opacity: 0
      }

      to {
        opacity: 1
      }
    }

    @keyframes fadeIn {
      0% {
        opacity: 0
      }

      to {
        opacity: 1
      }
    }

    .sr-alertgp .alert .close {
      position: absolute;
      top: 0;
      right: 0;
      z-index: 2
    }

    .sr-alertgp .alert .close:hover {
      -webkit-transform: rotate(270deg);
      transform: rotate(270deg);
      -webkit-transition: all .25s ease-out;
      transition: all .25s ease-out
    }

    .sr-alertgp .alert .sr-alert-icon img {
      max-width: 650px;
      width: 100%;
      -webkit-transform: scale(.7);
      transform: scale(.7);
      -webkit-transition: all .5s ease-out;
      transition: all .5s ease-out
    }

    .sr-alertgp .alert .actionbar {
      position: relative;
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-orient: vertical;
      -webkit-box-direction: normal;
      -ms-flex-direction: column;
      flex-direction: column;
      -webkit-box-align: center;
      -ms-flex-align: center;
      align-items: center;
      margin: 20px;
      width: 80%;
      height: 50px;
      -webkit-transition: all 1s cubic-bezier(.23, 1, .32, 1) 0ms;
      transition: all 1s cubic-bezier(.23, 1, .32, 1) 0ms
    }

    .sr-alertgp .alert .actionbar,
    .sr-alertgp .alert.notification {
      -webkit-box-pack: center;
      -ms-flex-pack: center;
      justify-content: center
    }

    .sr-alertgp .alert.notification {
      width: 500px;
      min-height: 350px
    }

    .sr-alertgp .alert.notification[data-state=siren] {
      background-image: -webkit-radial-gradient(circle farthest-corner at 10% 20%, #cd212a 0, #ec5f05 90%);
      background-image: radial-gradient(circle farthest-corner at 10% 20%, #cd212a 0, #ec5f05 90%)
    }

    .sr-alertgp .alert.notification[data-state=lock] {
      background-image: -webkit-radial-gradient(circle farthest-corner at 10% 20%, #8451a1 0, rgba(132, 81, 161, .83) 90%);
      background-image: radial-gradient(circle farthest-corner at 10% 20%, #8451a1 0, rgba(132, 81, 161, .83) 90%)
    }

    .sr-alertgp .alert.notification[data-state=warning] {
      background-image: -webkit-linear-gradient(left, #f2709c, #ff9472);
      background-image: linear-gradient(90deg, #f2709c, #ff9472)
    }

    .sr-alertgp .alert.notification[data-state=bug] {
      background-image: -webkit-linear-gradient(bottom, #ad5389, #3c1053);
      background-image: linear-gradient(0deg, #ad5389, #3c1053)
    }

    .sr-alertgp .alert.notification[data-state=safe],
    .sr-alertgp .alert.notification[data-state=server] {
      background-color: #8ec5fc;
      background-image: -webkit-linear-gradient(28deg, #8ec5fc, #e0c3fc);
      background-image: linear-gradient(62deg, #8ec5fc, #e0c3fc)
    }

    .sr-alertgp .alert.notification .sr-alert-icon {
      position: relative;
      width: 100%
    }

    .sr-alertgp .alert.notification .loading .progress {
      padding: 5px;
      background-color: #fff;
      border-radius: 50%
    }

    .sr-alertgp .alert.notification .loading .progress .circle-bg {
      stroke: transparent
    }

    .sr-alertgp .alert.notification .loading .progress .circle {
      stroke-width: 1
    }

    .sr-alertgp .alert.notification[data-state=siren] .loading .progress .circle {
      stroke: #cd212a
    }

    .sr-alertgp .alert.notification[data-state=lock] .loading .progress .circle {
      stroke: #8451a1
    }

    .sr-alertgp .alert.notification[data-state=warning] .loading .progress .circle {
      stroke: #f2709c
    }

    .sr-alertgp .alert.notification[data-state=bug] .loading .progress .circle {
      stroke: #ad5389
    }

    .sr-alertgp .alert.notification[data-state=safe] .loading .progress .circle,
    .sr-alertgp .alert.notification[data-state=server] .loading .progress .circle {
      stroke: #8ec5fc
    }

    .sr-alertgp .alert.notification .content {
      padding: 10px 70px;
      width: 100%;
      color: #fff;
      text-align: center;
      font-size: 28.8px;
      font-size: 1.8rem;
      box-sizing: border-box
    }

    .sr-alertgp .alert.notification .flag {
      position: absolute;
      left: 0;
      top: 0;
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-pack: center;
      -ms-flex-pack: center;
      justify-content: center;
      -webkit-box-align: center;
      -ms-flex-align: center;
      align-items: center;
      width: 100%;
      height: 100%;
      z-index: 100000
    }

    .sr-alertgp .alert.notification .flag img {
      width: 50px
    }

    .sr-alertgp .alert.notification[data-state=lock] .flag img {
      width: 30px
    }

    .sr-alertgp .alert.notification .flag img.swing {
      -webkit-transform-origin: center;
      transform-origin: center;
      -webkit-animation-name: swing;
      animation-name: swing;
      -webkit-animation-duration: 1s;
      animation-duration: 1s
    }

    .sr-alertgp .alert.notification .actionbar {
      -webkit-box-orient: horizontal;
      -webkit-box-direction: normal;
      -ms-flex-direction: row;
      flex-direction: row;
      -ms-flex-pack: distribute;
      justify-content: space-around;
      margin: 0
    }

    .sr-alertgp .alert.notification .return {
      padding: 5px 32px;
      color: #333;
      background-color: #fff;
      font-size: 15px;
      font-weight: 700;
      border-radius: 56px
    }

    .sr-alertgp .alert.notification .return:hover {
      box-shadow: 0 3px 1px -2px rgba(0, 0, 0, .2), 0 2px 2px 0 rgba(0, 0, 0, .14), 0 1px 5px 0 rgba(0, 0, 0, .12)
    }

    @-webkit-keyframes swing {
      20% {
        -webkit-transform: rotate(15deg);
        transform: rotate(15deg)
      }

      40% {
        -webkit-transform: rotate(-10deg);
        transform: rotate(-10deg)
      }

      60% {
        -webkit-transform: rotate(5deg);
        transform: rotate(5deg)
      }

      80% {
        -webkit-transform: rotate(-5deg);
        transform: rotate(-5deg)
      }

      to {
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg)
      }
    }

    @keyframes swing {
      20% {
        -webkit-transform: rotate(15deg);
        transform: rotate(15deg)
      }

      40% {
        -webkit-transform: rotate(-10deg);
        transform: rotate(-10deg)
      }

      60% {
        -webkit-transform: rotate(5deg);
        transform: rotate(5deg)
      }

      80% {
        -webkit-transform: rotate(-5deg);
        transform: rotate(-5deg)
      }

      to {
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg)
      }
    }
  </style>
  <style type="text/css">
    @-webkit-keyframes fadeInUp {
      0% {
        opacity: 0;
        -webkit-transform: translate3d(0, 100%, 0);
        transform: translate3d(0, 100%, 0)
      }

      to {
        opacity: 1;
        -webkit-transform: translateZ(0);
        transform: translateZ(0)
      }
    }

    @keyframes fadeInUp {
      0% {
        opacity: 0;
        -webkit-transform: translate3d(0, 100%, 0);
        transform: translate3d(0, 100%, 0)
      }

      to {
        opacity: 1;
        -webkit-transform: translateZ(0);
        transform: translateZ(0)
      }
    }

    @-webkit-keyframes fadeOutDown {
      0% {
        opacity: 1;
        -webkit-transform: translateZ(0);
        transform: translateZ(0)
      }

      to {
        opacity: 0;
        -webkit-transform: translate3d(0, 100%, 0);
        transform: translate3d(0, 100%, 0)
      }
    }

    @keyframes fadeOutDown {
      0% {
        opacity: 1;
        -webkit-transform: translateZ(0);
        transform: translateZ(0)
      }

      to {
        opacity: 0;
        -webkit-transform: translate3d(0, 100%, 0);
        transform: translate3d(0, 100%, 0)
      }
    }

    sr-promo-bg {
      position: fixed;
      right: 15px;
      bottom: 15px;
      z-index: 2147483646
    }

    sr-promo,
    sr-promo-notice {
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-pack: center;
      -ms-flex-pack: center;
      justify-content: center;
      -webkit-box-align: start;
      -ms-flex-align: start;
      align-items: flex-start;
      -webkit-box-orient: vertical;
      -webkit-box-direction: normal;
      -ms-flex-direction: column;
      flex-direction: column;
      padding: 10px;
      color: rgba(51, 51, 51, .87);
      background-color: #fff;
      border-radius: 4px;
      box-shadow: 0 12px 18px -6px rgba(0, 0, 0, .3);
      overflow: hidden;
      -webkit-transform-origin: bottom;
      transform-origin: bottom;
      -webkit-transition: all .6s ease;
      transition: all .6s ease;
      -webkit-animation-name: fadeInUp;
      animation-name: fadeInUp;
      -webkit-animation-duration: .5s;
      animation-duration: .5s;
      -webkit-animation-fill-mode: both;
      animation-fill-mode: both
    }

    sr-promo img {
      width: 220px;
      cursor: pointer
    }

    sr-promo-footer {
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-orient: horizontal;
      -webkit-box-direction: normal;
      -ms-flex-direction: row;
      flex-direction: row;
      -webkit-box-align: center;
      -ms-flex-align: center;
      align-items: center;
      -webkit-box-pack: justify;
      -ms-flex-pack: justify;
      justify-content: space-between;
      padding: 10px 0 0;
      width: 100%
    }

    sr-promo-a {
      padding: 5px 10px;
      color: #fff;
      font-size: 12px;
      font-weight: 700;
      border-radius: 2px;
      box-shadow: 0 2px 2px 0 rgba(0, 0, 0, .14), 0 1px 5px 0 rgba(0, 0, 0, .12), 0 3px 1px -2px rgba(0, 0, 0, .2);
      cursor: pointer
    }

    sr-promo-a.later {
      background-color: #2196f3
    }

    sr-promo-a.cancel {
      background-color: #757575
    }

    sr-promo-tip {
      font-size: 12px;
      padding: 5px 10px;
      border-radius: 2px
    }

    sr-promo-notice {
      position: absolute;
      top: 10px;
      left: 10px;
      right: 10px;
      height: 293px;
      padding-bottom: 0;
      -webkit-box-pack: start;
      -ms-flex-pack: start;
      justify-content: flex-start;
      font-size: 12px;
      border-radius: 0;
      box-shadow: none;
      overflow-y: hidden
    }

    sr-promo-notice:hover {
      overflow-y: overlay
    }

    sr-promo-notice-title {
      font-weight: 700;
      text-align: center;
      margin-bottom: 5px;
      width: 100%;
      font-size: 14px
    }

    sr-promo-notice-content {
      margin-top: 5px
    }
  </style>
  <style type="text/css">
    .simpread-tipsalert-root dialog-gp {
      position: absolute
    }

    .simpread-tipsalert-root dialog-gp .close {
      position: absolute;
      top: 0;
      right: 0;
      z-index: 2
    }

    .simpread-tipsalert-root dialog-content {
      padding: 0 !important;
      width: 650px !important
    }

    .simpread-tipsalert-root .details {
      position: relative;
      color: rgba(51, 51, 51, .87);
      font-family: Hiragino Sans GB, Microsoft Yahei;
      text-shadow: none
    }

    .simpread-tipsalert-root .details .carousel.carousel-slider {
      height: 450px;
      border-radius: 4px;
      box-shadow: 0 12px 18px -6px rgba(0, 0, 0, .3)
    }

    .simpread-tipsalert-root .details .carousels setion sr-div-center {
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-pack: center;
      -ms-flex-pack: center;
      justify-content: center;
      height: 321px;
      box-sizing: border-box
    }

    .simpread-tipsalert-root .details .carousels setion sr-div-center.hidden {
      display: none
    }

    .simpread-tipsalert-root .details .carousels setion sr-div-center img {
      margin-top: 20px !important;
      height: 321px;
      width: auto !important
    }

    .simpread-tipsalert-root .details .carousels setion sr-div-center sr-video {
      position: absolute;
      left: 0;
      right: 0;
      width: 100%;
      height: 321px;
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-pack: center;
      -ms-flex-pack: center;
      justify-content: center;
      -webkit-box-align: center;
      -ms-flex-align: center;
      align-items: center;
      z-index: 2
    }

    .simpread-tipsalert-root .details .carousels setion .tipsimg.error {
      width: 0 !important;
      height: 0 !important
    }

    .simpread-tipsalert-root .details .carousels setion .tipsimg:after {
      content: "\F1C5" " Sorry, the image below is broken :(";
      font-family: Font Awesome\ 5 Free;
      font-weight: 900;
      position: absolute;
      top: 0;
      left: 0;
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-pack: center;
      -ms-flex-pack: center;
      justify-content: center;
      -webkit-box-align: center;
      -ms-flex-align: center;
      align-items: center;
      width: 650px;
      height: 100%;
      color: #646464;
      background-color: #fff;
      z-index: 2
    }

    .simpread-tipsalert-root .details .carousels setion sr-div-center sr-video+img {
      opacity: .5
    }

    .simpread-tipsalert-root .details .carousels setion img {
      margin-top: -82px;
      width: 100%
    }

    .simpread-tipsalert-root .details .carousels setion video {
      height: 321px
    }

    .simpread-tipsalert-root .details .carousels setion video.active {
      display: block
    }

    .simpread-tipsalert-root .details .carousels .descr {
      position: absolute;
      left: 0;
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-orient: horizontal;
      -webkit-box-direction: normal;
      -ms-flex-direction: row;
      flex-direction: row;
      -webkit-box-pack: center;
      -ms-flex-pack: center;
      justify-content: center;
      -webkit-box-align: center;
      -ms-flex-align: center;
      align-items: center;
      height: 80px;
      width: 100%;
      padding-bottom: 10px;
      background-color: #fff;
      font-size: 14px
    }

    .simpread-tipsalert-root .details .carousels .descr b {
      margin: 0 3px
    }

    .simpread-tipsalert-root .details .carousels .descr.large {
      font-size: 17px
    }

    .simpread-tipsalert-root .floating {
      position: absolute;
      left: 0;
      right: 0;
      bottom: 14px;
      height: 80px;
      overflow-y: hidden
    }

    .simpread-tipsalert-root .floating,
    .simpread-tipsalert-root .floating .docs {
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-pack: center;
      -ms-flex-pack: center;
      justify-content: center;
      -webkit-box-align: center;
      -ms-flex-align: center;
      align-items: center
    }

    .simpread-tipsalert-root .floating .docs {
      -webkit-box-orient: vertical;
      -webkit-box-direction: normal;
      -ms-flex-direction: column;
      flex-direction: column;
      padding: 1px 40px;
      height: 30px;
      color: #fff;
      background-color: #4dbb7c;
      font-size: 15px;
      font-weight: 400;
      border-radius: 30px;
      -webkit-transition: all .5s cubic-bezier(.23, 1, .32, 1) 0ms;
      transition: all .5s cubic-bezier(.23, 1, .32, 1) 0ms;
      box-shadow: 0 12px 18px -6px rgba(0, 0, 0, .3)
    }

    .simpread-tipsalert-root footer {
      position: absolute;
      top: 199px;
      left: -60px;
      right: -60px;
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-orient: horizontal;
      -webkit-box-direction: normal;
      -ms-flex-direction: row;
      flex-direction: row;
      -webkit-box-pack: justify;
      -ms-flex-pack: justify;
      justify-content: space-between;
      -webkit-box-align: center;
      -ms-flex-align: center;
      align-items: center
    }
  </style>
  <style type="text/css">
    [customscroll],
    [data-customscroll] {
      overflow-y: hidden
    }

    [customscroll]:hover,
    [data-customscroll]:hover {
      overflow-y: overlay
    }

    [customscroll]::-webkit-scrollbar-track,
    [data-customscroll]::-webkit-scrollbar-track {
      background-color: transparent
    }

    [customscroll]::-webkit-scrollbar,
    [data-customscroll]::-webkit-scrollbar {
      width: 12px
    }

    [customscroll]::-webkit-scrollbar-thumb,
    [data-customscroll]::-webkit-scrollbar-thumb {
      background-clip: padding-box;
      padding-top: 80px;
      background-color: #ddd;
      border: 3px solid transparent;
      border-radius: 8px
    }

    sr-annote-popup {
      display: block;
      padding-right: 20px;
      width: 480px;
      height: 100%
    }

    sr-annote-popup-gp {
      position: relative;
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-orient: vertical;
      -webkit-box-direction: normal;
      -ms-flex-direction: column;
      flex-direction: column;
      -webkit-box-pack: center;
      -ms-flex-pack: center;
      justify-content: center;
      margin-bottom: 25px
    }

    sr-annote-popup-div {
      width: 100%;
      color: var(--text-color);
      text-align: left;
      font-weight: 400
    }

    sr-annote-popup-label {
      color: rgba(0, 137, 123, .8);
      font-size: 14px;
      font-weight: 700;
      -webkit-user-select: none;
      -moz-user-select: none;
      -ms-user-select: none;
      user-select: none;
      pointer-events: none;
      -webkit-transition: all .45s cubic-bezier(.23, 1, .32, 1) 0ms;
      transition: all .45s cubic-bezier(.23, 1, .32, 1) 0ms;
      -webkit-transform: scale(.75) translateY(-8px);
      transform: scale(.75) translateY(-8px);
      -webkit-transform-origin: left top 0;
      transform-origin: left top 0
    }

    sr-annote-popup-desc {
      position: relative;
      margin: 10px 0;
      padding: 10px;
      background-color: var(--background-hover-color);
      font-size: 15px;
      text-align: justify;
      font-weight: 400;
      line-height: 1.6;
      border-radius: 4px
    }

    sr-annote-popup-desc sr-annote {
      background-color: transparent !important
    }

    sr-annote-popup-gp[type=img] {
      -webkit-box-align: center;
      -ms-flex-align: center;
      align-items: center
    }

    sr-annote-popup-gp svg path {
      fill: var(--active-color) !important
    }

    sr-annote-popup-gp ol,
    sr-annote-popup-gp ul {
      margin: 0 0 1.2em;
      margin-left: 1.3em;
      padding: 0;
      list-style: disc
    }

    sr-annote-popup-gp ol li,
    sr-annote-popup-gp ul li {
      margin: 0 0 1.2em;
      font-size: 15px;
      list-style: disc
    }

    sr-annote-popup-gp a {
      padding: 0 5px;
      vertical-align: baseline;
      vertical-align: initial
    }

    sr-annote-popup-gp a,
    sr-annote-popup-gp a:link {
      color: #463f5c;
      font-size: inherit;
      font-weight: inherit;
      text-decoration: underline;
      border: none
    }

    sr-annote-popup-gp a:hover {
      background: transparent
    }

    sr-annote-popup-gp img {
      margin: 0;
      padding: 0;
      max-width: 50%;
      height: auto;
      background: #fff;
      border: 0;
      border-radius: 6px;
      box-shadow: 0 20px 20px -10px rgba(0, 0, 0, .1)
    }

    sr-annote-popup-gp pre {
      padding: 10px !important;
      background-color: transparent !important;
      max-height: 400px;
      white-space: pre-line;
      word-break: break-all;
      border-radius: 6px !important;
      overflow-x: hidden !important
    }

    sr-annote-popup auto-complete list-view {
      max-height: 150px !important
    }

    sr-annote-popup list-view::-webkit-scrollbar-thumb {
      background-clip: padding-box;
      border-radius: 10px;
      border: 2px solid transparent;
      background-color: rgba(85, 85, 85, .55)
    }

    sr-annote-popup list-view::-webkit-scrollbar {
      width: 10px;
      -webkit-transition: width .7s cubic-bezier(.4, 0, .2, 1);
      transition: width .7s cubic-bezier(.4, 0, .2, 1)
    }

    sr-annote-popup-gp sr-annote-floatingbar {
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-pack: justify;
      -ms-flex-pack: justify;
      justify-content: space-between
    }

    sr-annote-popup-gp sr-annote-floatingbar sr-anote-fb-item[data-color-type] {
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-pack: center;
      -ms-flex-pack: center;
      justify-content: center;
      -webkit-box-align: center;
      -ms-flex-align: center;
      align-items: center;
      margin-right: 20px;
      width: 65px;
      height: 20px;
      border-radius: 5px
    }

    sr-annote-popup-gp sr-annote-floatingbar sr-anote-fb-item:last-child {
      margin-right: 0
    }

    sr-annote-popup-gp sr-anote-item {
      display: -webkit-box !important;
      display: -ms-flexbox !important;
      display: flex !important;
      -webkit-box-pack: center;
      -ms-flex-pack: center;
      justify-content: center;
      -webkit-box-align: center;
      -ms-flex-align: center;
      align-items: center;
      margin-right: 20px;
      padding: 0 5px;
      width: 65px;
      height: 20px;
      font-size: 13px;
      font-weight: 400;
      border-radius: 5px;
      -webkit-transition: all .5s ease-in-out 0ms;
      transition: all .5s ease-in-out 0ms
    }

    sr-annote-popup-gp sr-anote-item:last-child {
      margin-right: 0
    }

    sr-annote-popup-gp sr-anote-item.hidden {
      opacity: 0;
      pointer-events: none
    }

    sr-annote-popup-gp sr-anote-lock {
      position: absolute;
      left: 0;
      top: -3px;
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-pack: center;
      -ms-flex-pack: center;
      justify-content: center;
      -webkit-box-align: center;
      -ms-flex-align: center;
      align-items: center;
      width: 100%;
      height: 100%;
      background-color: hsla(0, 0%, 100%, .8);
      z-index: 1
    }

    sr-annote-popup-gp sr-anote-lock svg {
      margin-top: 3px;
      cursor: pointer
    }
  </style>
  <style type="text/css">
    .gu-mirror {
      position: fixed !important;
      margin: 0 !important;
      z-index: 9999 !important;
      opacity: .8;
      -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=80)";
      filter: alpha(opacity=80)
    }

    .gu-hide {
      display: none !important
    }

    .gu-unselectable {
      -webkit-user-select: none !important;
      -moz-user-select: none !important;
      -ms-user-select: none !important;
      user-select: none !important
    }

    .gu-transit {
      opacity: .2;
      -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=20)";
      filter: alpha(opacity=20)
    }
  </style>
  <style type="text/css">
    sr-search {
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-orient: vertical;
      -webkit-box-direction: normal;
      -ms-flex-direction: column;
      flex-direction: column;
      margin-bottom: 10px;
      padding: 10px;
      font-size: 13px;
      border: 1px solid #dfe1e5;
      border-radius: 8px
    }

    sr-search.floating {
      position: fixed;
      top: 170px;
      right: 10px;
      width: 400px;
      max-height: 500px;
      z-index: 2000
    }

    sr-search.bing {
      margin-left: -20px;
      margin-right: -20px
    }

    sr-search sr-search-header {
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-orient: horizontal;
      -webkit-box-direction: normal;
      -ms-flex-direction: row;
      flex-direction: row;
      -webkit-box-align: center;
      -ms-flex-align: center;
      align-items: center;
      margin-bottom: 10px
    }

    sr-search sr-search-header img {
      margin-right: 10px;
      width: 22px
    }

    sr-search sr-search-header sr-search-span {
      font-weight: 700
    }

    sr-search-unreader-group {
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-orient: vertical;
      -webkit-box-direction: normal;
      -ms-flex-direction: column;
      flex-direction: column;
      border-bottom: 1px solid #dfe1e5;
      margin-bottom: 5px
    }

    sr-search-content {
      max-height: 666px;
      overflow-x: hidden;
      overflow-y: auto
    }

    sr-search-unreader-title {
      font-weight: 700;
      font-size: 15px;
      margin-bottom: 5px
    }

    sr-search-unreader-create {
      margin-bottom: 5px;
      color: #70757a
    }

    sr-search-unreader-desc {
      margin-bottom: 5px
    }

    sr-search-unreader-tags {
      margin-bottom: 5px;
      color: #70757a;
      font-size: 11px;
      font-style: italic
    }

    sr-search-unreader-tag {
      margin-right: 5px
    }

    sr-search-paging {
      width: 100%;
      margin: 10px
    }

    sr-search-paging,
    sr-search-paging sr-search-more {
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-pack: center;
      -ms-flex-pack: center;
      justify-content: center;
      -webkit-box-align: center;
      -ms-flex-align: center;
      align-items: center
    }

    sr-search-paging sr-search-more {
      width: 36px;
      height: 36px;
      box-shadow: 0 0 0 1px rgba(0, 0, 0, .04), 0 4px 8px 0 rgba(0, 0, 0, .2);
      border-radius: 50%;
      opacity: .9;
      cursor: pointer
    }

    sr-search-paging sr-search-more:hover {
      opacity: 1
    }

    sr-search-paging sr-search-more.disable {
      cursor: no-drop
    }

    sr-search-paging sr-search-more svg {
      width: 24px;
      height: 24px;
      fill: #757575
    }

    sr-search-info {
      text-align: center
    }
  </style>
  <style type="text/css">
    .cubox-extension-helper-button {
      position: absolute !important;
      display: none;
      width: 26px !important;
      height: 26px !important;
      justify-content: center;
      align-items: center;
      border: 1px solid #C6C6C6;
      border-radius: 6px !important;
      background: #fff !important;
      z-index: 99999999999999999999 !important;
      cursor: pointer;
      filter: drop-shadow(1px 2px 8px rgba(0, 0, 0, 0.15));
      transition: border-color .2s ease;
    }

    .cubox-extension-helper-button:hover {
      border-color: #636363;
    }

    .cubox-extension-helper-button svg {
      pointer-events: none;
      opacity: .8 !important;
      transition: opacity .2s ease;
    }

    .cubox-extension-helper-button:hover svg {
      opacity: 1 !important;
    }
  </style>
  <meta property="og:url" content="https://bbruceyuan.com/post/9.html">
  <meta property="og:site_name" content="用代码打点酱油的 bbruceyuan">
  <meta property="og:title" content="简单方法增加Query召回的多样性">
  <meta property="og:description" content="使用简单方法增加Query召回的多样性">
  <meta property="og:type" content="article">
  <meta property="og:locale" content="zh-CN">
  <meta property="og:updated_time" content="2023-12-22T13:37:03.000Z">
  <meta property="article:author" content="bbruceyuan">
  <meta property="article:tag" content="算法妙用">
  <meta property="article:published_time" content="2020-08-03T12:00:00.000Z">
  <meta property="article:modified_time" content="2023-12-22T13:37:03.000Z">
  <script
    type="application/ld+json">{"@context":"https://schema.org","@type":"Article","headline":"简单方法增加Query召回的多样性","image":[""],"datePublished":"2020-08-03T12:00:00.000Z","dateModified":"2023-12-22T13:37:03.000Z","author":[{"@type":"Person","name":"bbruceyuan","link":"https://github.com/bbruceyuan"}]}</script>
  <meta name="baidu-site-verification" content="codeva-6UT5nFOXMY">
  <link rel="icon" href="./增加query多样性_files/icon.jpg">
  <title>简单方法增加Query召回的多样性 | 用代码打点酱油的 bbruceyuan</title>
  <meta name="description" content="使用简单方法增加Query召回的多样性">
</head>

<body>
  <div id="app"><!--[--><span tabindex="-1"></span><a href="https://bbruceyuan.com/post/9.html#main-content"
      class="vp-skip-link sr-only">跳至主要內容</a>
    <div class="theme-container has-toc">
      <header id="navbar" class="vp-navbar">
        <div class="vp-navbar-start"><button type="button" class="vp-toggle-sidebar-button" title="Toggle Sidebar"><span
              class="icon"></span></button><!----><a class="vp-link vp-brand vp-brand"
            href="https://bbruceyuan.com/"><img class="vp-nav-logo" src="./增加query多样性_files/icon.jpg"
              alt="用代码打点酱油的 bbruceyuan"><!----><span class="vp-site-name hide-in-pad">用代码打点酱油的
              bbruceyuan</span></a><!----></div>
        <div class="vp-navbar-center"><!----><!----></div>
        <div class="vp-navbar-end"><!---->
          <nav class="vp-nav-links">
            <div class="nav-item hide-in-mobile"><a aria-label="博客" class="vp-link nav-link nav-link"
                href="https://bbruceyuan.com/blog.html"><!---->博客<!----></a></div>
            <div class="nav-item hide-in-mobile"><a aria-label="友链" class="vp-link nav-link nav-link"
                href="https://bbruceyuan.com/link.html"><!---->友链<!----></a></div>
            <div class="nav-item hide-in-mobile"><a aria-label="关于我" class="vp-link nav-link nav-link"
                href="https://bbruceyuan.com/about.html"><!---->关于我<!----></a></div>
          </nav>
          <div class="nav-item vp-repo"><a class="vp-repo-link" href="https://github.com/bbruceyuan" target="_blank"
              rel="noopener noreferrer" aria-label="GitHub"><svg xmlns="http://www.w3.org/2000/svg"
                class="icon github-icon" viewBox="0 0 1024 1024" fill="currentColor" aria-label="github icon"
                style="width: 1.25rem; height: 1.25rem; vertical-align: middle;">
                <path
                  d="M511.957 21.333C241.024 21.333 21.333 240.981 21.333 512c0 216.832 140.544 400.725 335.574 465.664 24.49 4.395 32.256-10.07 32.256-23.083 0-11.69.256-44.245 0-85.205-136.448 29.61-164.736-64.64-164.736-64.64-22.315-56.704-54.4-71.765-54.4-71.765-44.587-30.464 3.285-29.824 3.285-29.824 49.195 3.413 75.179 50.517 75.179 50.517 43.776 75.008 114.816 53.333 142.762 40.79 4.523-31.66 17.152-53.377 31.19-65.537-108.971-12.458-223.488-54.485-223.488-242.602 0-53.547 19.114-97.323 50.517-131.67-5.035-12.33-21.93-62.293 4.779-129.834 0 0 41.258-13.184 134.912 50.346a469.803 469.803 0 0 1 122.88-16.554c41.642.213 83.626 5.632 122.88 16.554 93.653-63.488 134.784-50.346 134.784-50.346 26.752 67.541 9.898 117.504 4.864 129.834 31.402 34.347 50.474 78.123 50.474 131.67 0 188.586-114.73 230.016-224.042 242.09 17.578 15.232 33.578 44.672 33.578 90.454v135.85c0 13.142 7.936 27.606 32.854 22.87C862.25 912.597 1002.667 728.747 1002.667 512c0-271.019-219.648-490.667-490.71-490.667z">
                </path>
              </svg></a></div><button type="button" class="search-pro-button" role="search" aria-label="搜索"><svg
              xmlns="http://www.w3.org/2000/svg" class="icon search-icon" viewBox="0 0 1024 1024" fill="currentColor"
              aria-label="search icon">
              <path
                d="M192 480a256 256 0 1 1 512 0 256 256 0 0 1-512 0m631.776 362.496-143.2-143.168A318.464 318.464 0 0 0 768 480c0-176.736-143.264-320-320-320S128 303.264 128 480s143.264 320 320 320a318.016 318.016 0 0 0 184.16-58.592l146.336 146.368c12.512 12.48 32.768 12.48 45.28 0 12.48-12.512 12.48-32.768 0-45.28">
              </path>
            </svg>
            <div class="search-pro-placeholder">搜索</div>
            <div class="search-pro-key-hints"><kbd class="search-pro-key">⌃</kbd><kbd class="search-pro-key">K</kbd>
            </div>
          </button>
          <div class="nav-item hide-in-mobile"><button type="button" id="appearance-switch"><svg
                xmlns="http://www.w3.org/2000/svg" class="icon auto-icon" viewBox="0 0 1024 1024" fill="currentColor"
                aria-label="auto icon" style="display: block;">
                <path
                  d="M512 992C246.92 992 32 777.08 32 512S246.92 32 512 32s480 214.92 480 480-214.92 480-480 480zm0-840c-198.78 0-360 161.22-360 360 0 198.84 161.22 360 360 360s360-161.16 360-360c0-198.78-161.22-360-360-360zm0 660V212c165.72 0 300 134.34 300 300 0 165.72-134.28 300-300 300z">
                </path>
              </svg><svg xmlns="http://www.w3.org/2000/svg" class="icon dark-icon" viewBox="0 0 1024 1024"
                fill="currentColor" aria-label="dark icon" style="display: none;">
                <path
                  d="M524.8 938.667h-4.267a439.893 439.893 0 0 1-313.173-134.4 446.293 446.293 0 0 1-11.093-597.334A432.213 432.213 0 0 1 366.933 90.027a42.667 42.667 0 0 1 45.227 9.386 42.667 42.667 0 0 1 10.24 42.667 358.4 358.4 0 0 0 82.773 375.893 361.387 361.387 0 0 0 376.747 82.774 42.667 42.667 0 0 1 54.187 55.04 433.493 433.493 0 0 1-99.84 154.88 438.613 438.613 0 0 1-311.467 128z">
                </path>
              </svg><svg xmlns="http://www.w3.org/2000/svg" class="icon light-icon" viewBox="0 0 1024 1024"
                fill="currentColor" aria-label="light icon" style="display: none;">
                <path
                  d="M952 552h-80a40 40 0 0 1 0-80h80a40 40 0 0 1 0 80zM801.88 280.08a41 41 0 0 1-57.96-57.96l57.96-58a41.04 41.04 0 0 1 58 58l-58 57.96zM512 752a240 240 0 1 1 0-480 240 240 0 0 1 0 480zm0-560a40 40 0 0 1-40-40V72a40 40 0 0 1 80 0v80a40 40 0 0 1-40 40zm-289.88 88.08-58-57.96a41.04 41.04 0 0 1 58-58l57.96 58a41 41 0 0 1-57.96 57.96zM192 512a40 40 0 0 1-40 40H72a40 40 0 0 1 0-80h80a40 40 0 0 1 40 40zm30.12 231.92a41 41 0 0 1 57.96 57.96l-57.96 58a41.04 41.04 0 0 1-58-58l58-57.96zM512 832a40 40 0 0 1 40 40v80a40 40 0 0 1-80 0v-80a40 40 0 0 1 40-40zm289.88-88.08 58 57.96a41.04 41.04 0 0 1-58 58l-57.96-58a41 41 0 0 1 57.96-57.96z">
                </path>
              </svg></button></div><!----><button type="button" class="vp-toggle-navbar-button"
            aria-label="Toggle Navbar" aria-expanded="false" aria-controls="nav-screen"><span><span
                class="vp-top"></span><span class="vp-middle"></span><span class="vp-bottom"></span></span></button>
        </div>
      </header><!----><!---->
      <div class="toggle-sidebar-wrapper"><span class="arrow start"></span></div>
      <aside id="sidebar" class="vp-sidebar"><!---->
        <ul class="vp-sidebar-links">
          <li>
            <section class="vp-sidebar-group"><button class="vp-sidebar-heading clickable" type="button"><!----><span
                  class="vp-sidebar-title">年终总结</span><span class="vp-arrow end"></span></button><!----></section>
          </li>
          <li>
            <section class="vp-sidebar-group"><button class="vp-sidebar-heading clickable" type="button"><!----><span
                  class="vp-sidebar-title">随笔</span><span class="vp-arrow end"></span></button><!----></section>
          </li>
          <li>
            <section class="vp-sidebar-group"><button class="vp-sidebar-heading clickable active"
                type="button"><!----><span class="vp-sidebar-title">技术</span><span
                  class="vp-arrow down"></span></button>
              <ul class="vp-sidebar-links">
                <li><a aria-label="2020年了，还有必要学习分词算法吗？"
                    class="vp-link nav-link vp-sidebar-link vp-sidebar-page nav-link vp-sidebar-link vp-sidebar-page"
                    href="https://bbruceyuan.com/post/1.html"><!---->2020年了，还有必要学习分词算法吗？<!----></a>
                  <ul class="vp-sidebar-sub-headers"></ul>
                </li>
                <li><a aria-label="深度学习时代，分词算法的真实应用实例"
                    class="vp-link nav-link vp-sidebar-link vp-sidebar-page nav-link vp-sidebar-link vp-sidebar-page"
                    href="https://bbruceyuan.com/post/2.html"><!---->深度学习时代，分词算法的真实应用实例<!----></a>
                  <ul class="vp-sidebar-sub-headers"></ul>
                </li>
                <li><a aria-label="关于隐马尔可夫模型(HMM)，需要知道什么？"
                    class="vp-link nav-link vp-sidebar-link vp-sidebar-page nav-link vp-sidebar-link vp-sidebar-page"
                    href="https://bbruceyuan.com/post/3.html"><!---->关于隐马尔可夫模型(HMM)，需要知道什么？<!----></a>
                  <ul class="vp-sidebar-sub-headers"></ul>
                </li>
                <li><a
                    aria-label="Transition-based Directed Graph Construction for Emotion-Cause Pair Extraction (中文介绍)"
                    class="vp-link nav-link vp-sidebar-link vp-sidebar-page nav-link vp-sidebar-link vp-sidebar-page"
                    href="https://bbruceyuan.com/post/5.html"><!---->Transition-based Directed Graph Construction for
                    Emotion-Cause Pair Extraction (中文介绍)<!----></a>
                  <ul class="vp-sidebar-sub-headers"></ul>
                </li>
                <li><a aria-label="Must-read Papers on Emotion-Cause Pair Extraction"
                    class="vp-link nav-link vp-sidebar-link vp-sidebar-page nav-link vp-sidebar-link vp-sidebar-page"
                    href="https://bbruceyuan.com/post/7.html"><!---->Must-read Papers on Emotion-Cause Pair
                    Extraction<!----></a>
                  <ul class="vp-sidebar-sub-headers"></ul>
                </li>
                <li><a aria-label="01之间均匀分区取两点构成三角形的概率-证明加代码实现"
                    class="vp-link nav-link vp-sidebar-link vp-sidebar-page nav-link vp-sidebar-link vp-sidebar-page"
                    href="https://bbruceyuan.com/post/8.html"><!---->01之间均匀分区取两点构成三角形的概率-证明加代码实现<!----></a>
                  <ul class="vp-sidebar-sub-headers"></ul>
                </li>
                <li><a aria-label="简单方法增加Query召回的多样性"
                    class="vp-link nav-link active vp-sidebar-link vp-sidebar-page active nav-link active vp-sidebar-link vp-sidebar-page active"
                    href="https://bbruceyuan.com/post/9.html"><!---->简单方法增加Query召回的多样性<!----></a>
                  <ul class="vp-sidebar-sub-headers">
                    <li class="vp-sidebar-sub-header"><a aria-label="1. 真正的Qeury召回的多样性"
                        class="vp-link nav-link vp-sidebar-link vp-heading nav-link vp-sidebar-link vp-heading"
                        href="https://bbruceyuan.com/post/9.html#_1-%E7%9C%9F%E6%AD%A3%E7%9A%84qeury%E5%8F%AC%E5%9B%9E%E7%9A%84%E5%A4%9A%E6%A0%B7%E6%80%A7"><!---->1.
                        真正的Qeury召回的多样性<!----></a>
                      <ul class="vp-sidebar-sub-headers"></ul>
                    </li>
                    <li class="vp-sidebar-sub-header"><a aria-label="2. 我们所面临的召回多样性问题？"
                        class="vp-link nav-link vp-sidebar-link vp-heading nav-link vp-sidebar-link vp-heading"
                        href="https://bbruceyuan.com/post/9.html#_2-%E6%88%91%E4%BB%AC%E6%89%80%E9%9D%A2%E4%B8%B4%E7%9A%84%E5%8F%AC%E5%9B%9E%E5%A4%9A%E6%A0%B7%E6%80%A7%E9%97%AE%E9%A2%98"><!---->2.
                        我们所面临的召回多样性问题？<!----></a>
                      <ul class="vp-sidebar-sub-headers"></ul>
                    </li>
                    <li class="vp-sidebar-sub-header"><a aria-label="3. 分析Query发现的问题？"
                        class="vp-link nav-link vp-sidebar-link vp-heading nav-link vp-sidebar-link vp-heading"
                        href="https://bbruceyuan.com/post/9.html#_3-%E5%88%86%E6%9E%90query%E5%8F%91%E7%8E%B0%E7%9A%84%E9%97%AE%E9%A2%98"><!---->3.
                        分析Query发现的问题？<!----></a>
                      <ul class="vp-sidebar-sub-headers"></ul>
                    </li>
                    <li class="vp-sidebar-sub-header"><a aria-label="4. 足够简单的方法"
                        class="vp-link nav-link vp-sidebar-link vp-heading nav-link vp-sidebar-link vp-heading"
                        href="https://bbruceyuan.com/post/9.html#_4-%E8%B6%B3%E5%A4%9F%E7%AE%80%E5%8D%95%E7%9A%84%E6%96%B9%E6%B3%95"><!---->4.
                        足够简单的方法<!----></a>
                      <ul class="vp-sidebar-sub-headers">
                        <li class="vp-sidebar-sub-header"><a aria-label="4.1 Question id多样化"
                            class="vp-link nav-link vp-sidebar-link vp-heading nav-link vp-sidebar-link vp-heading"
                            href="https://bbruceyuan.com/post/9.html#_4-1-question-id%E5%A4%9A%E6%A0%B7%E5%8C%96"><!---->4.1
                            Question id多样化<!----></a>
                          <ul class="vp-sidebar-sub-headers"></ul>
                        </li>
                        <li class="vp-sidebar-sub-header"><a aria-label="4.2 使用最小编辑距离选择Query"
                            class="vp-link nav-link vp-sidebar-link vp-heading nav-link vp-sidebar-link vp-heading"
                            href="https://bbruceyuan.com/post/9.html#_4-2-%E4%BD%BF%E7%94%A8%E6%9C%80%E5%B0%8F%E7%BC%96%E8%BE%91%E8%B7%9D%E7%A6%BB%E9%80%89%E6%8B%A9query"><!---->4.2
                            使用最小编辑距离选择Query<!----></a>
                          <ul class="vp-sidebar-sub-headers"></ul>
                        </li>
                      </ul>
                    </li>
                  </ul>
                </li>
                <li><a aria-label="Python实现蓄水池算法"
                    class="vp-link nav-link vp-sidebar-link vp-sidebar-page nav-link vp-sidebar-link vp-sidebar-page"
                    href="https://bbruceyuan.com/post/10.html"><!---->Python实现蓄水池算法<!----></a>
                  <ul class="vp-sidebar-sub-headers"></ul>
                </li>
                <li><a aria-label="NER上分利器：实体边界重定位"
                    class="vp-link nav-link vp-sidebar-link vp-sidebar-page nav-link vp-sidebar-link vp-sidebar-page"
                    href="https://bbruceyuan.com/post/17.html"><!---->NER上分利器：实体边界重定位<!----></a>
                  <ul class="vp-sidebar-sub-headers"></ul>
                </li>
                <li><a aria-label="倒排索引原理与python实现"
                    class="vp-link nav-link vp-sidebar-link vp-sidebar-page nav-link vp-sidebar-link vp-sidebar-page"
                    href="https://bbruceyuan.com/post/29.html"><!---->倒排索引原理与python实现<!----></a>
                  <ul class="vp-sidebar-sub-headers"></ul>
                </li>
              </ul>
            </section>
          </li>
          <li>
            <section class="vp-sidebar-group"><button class="vp-sidebar-heading clickable" type="button"><!----><span
                  class="vp-sidebar-title">Python 类型体操</span><span class="vp-arrow end"></span></button><!---->
            </section>
          </li>
        </ul><!---->
      </aside>
      <main id="main-content" class="vp-page"><!----><!---->
        <nav class="vp-breadcrumb">
          <ol vocab="https://schema.org/" typeof="BreadcrumbList">
            <li class="" property="itemListElement" typeof="ListItem"><a property="item" typeof="WebPage"
                class="vp-link" href="https://bbruceyuan.com/"><!----><span property="name">Home</span></a>
              <meta property="position" content="1">
            </li>
            <li class="" property="itemListElement" typeof="ListItem"><a property="item" typeof="WebPage"
                class="vp-link" href="https://bbruceyuan.com/post/"><!----><span property="name">post</span></a>
              <meta property="position" content="2">
            </li>
            <li class="is-active" property="itemListElement" typeof="ListItem"><a property="item" typeof="WebPage"
                class="vp-link" href="https://bbruceyuan.com/post/9.html"><!----><span
                  property="name">简单方法增加Query召回的多样性</span></a>
              <meta property="position" content="3">
            </li>
          </ol>
        </nav>
        <div class="vp-page-title">
          <h1><!---->简单方法增加Query召回的多样性</h1>
          <div class="page-info"><span class="page-author-info" aria-label="作者"><svg xmlns="http://www.w3.org/2000/svg"
                class="icon author-icon" viewBox="0 0 1024 1024" fill="currentColor" aria-label="author icon">
                <path
                  d="M649.6 633.6c86.4-48 147.2-144 147.2-249.6 0-160-128-288-288-288s-288 128-288 288c0 108.8 57.6 201.6 147.2 249.6-121.6 48-214.4 153.6-240 288-3.2 9.6 0 19.2 6.4 25.6 3.2 9.6 12.8 12.8 22.4 12.8h704c9.6 0 19.2-3.2 25.6-12.8 6.4-6.4 9.6-16 6.4-25.6-25.6-134.4-121.6-240-243.2-288z">
                </path>
              </svg><span><span class="page-author-item">bbruceyuan</span></span><span property="author"
                content="bbruceyuan"></span></span><!----><span class="page-date-info" aria-label="写作日期"><svg
                xmlns="http://www.w3.org/2000/svg" class="icon calendar-icon" viewBox="0 0 1024 1024"
                fill="currentColor" aria-label="calendar icon">
                <path
                  d="M716.4 110.137c0-18.753-14.72-33.473-33.472-33.473-18.753 0-33.473 14.72-33.473 33.473v33.473h66.993v-33.473zm-334.87 0c0-18.753-14.72-33.473-33.473-33.473s-33.52 14.72-33.52 33.473v33.473h66.993v-33.473zm468.81 33.52H716.4v100.465c0 18.753-14.72 33.473-33.472 33.473a33.145 33.145 0 01-33.473-33.473V143.657H381.53v100.465c0 18.753-14.72 33.473-33.473 33.473a33.145 33.145 0 01-33.473-33.473V143.657H180.6A134.314 134.314 0 0046.66 277.595v535.756A134.314 134.314 0 00180.6 947.289h669.74a134.36 134.36 0 00133.94-133.938V277.595a134.314 134.314 0 00-133.94-133.938zm33.473 267.877H147.126a33.145 33.145 0 01-33.473-33.473c0-18.752 14.72-33.473 33.473-33.473h736.687c18.752 0 33.472 14.72 33.472 33.473a33.145 33.145 0 01-33.472 33.473z">
                </path>
              </svg><span>2020年8月3日</span>
              <meta property="datePublished" content="2020-08-03T12:00:00.000Z">
            </span><!----><span class="page-reading-time-info" aria-label="阅读时间"><svg xmlns="http://www.w3.org/2000/svg"
                class="icon timer-icon" viewBox="0 0 1024 1024" fill="currentColor" aria-label="timer icon">
                <path
                  d="M799.387 122.15c4.402-2.978 7.38-7.897 7.38-13.463v-1.165c0-8.933-7.38-16.312-16.312-16.312H256.33c-8.933 0-16.311 7.38-16.311 16.312v1.165c0 5.825 2.977 10.874 7.637 13.592 4.143 194.44 97.22 354.963 220.201 392.763-122.204 37.542-214.893 196.511-220.2 389.397-4.661 5.049-7.638 11.651-7.638 19.03v5.825h566.49v-5.825c0-7.379-2.849-13.981-7.509-18.9-5.049-193.016-97.867-351.985-220.2-389.527 123.24-37.67 216.446-198.453 220.588-392.892zM531.16 450.445v352.632c117.674 1.553 211.787 40.778 211.787 88.676H304.097c0-48.286 95.149-87.382 213.728-88.676V450.445c-93.077-3.107-167.901-81.297-167.901-177.093 0-8.803 6.99-15.793 15.793-15.793 8.803 0 15.794 6.99 15.794 15.793 0 80.261 63.69 145.635 142.01 145.635s142.011-65.374 142.011-145.635c0-8.803 6.99-15.793 15.794-15.793s15.793 6.99 15.793 15.793c0 95.019-73.789 172.82-165.96 177.093z">
                </path>
              </svg><span>大约 2 分钟</span>
              <meta property="timeRequired" content="PT2M">
            </span><span class="page-category-info" aria-label="分类"><svg xmlns="http://www.w3.org/2000/svg"
                class="icon category-icon" viewBox="0 0 1024 1024" fill="currentColor" aria-label="category icon">
                <path
                  d="M148.41 106.992h282.176c22.263 0 40.31 18.048 40.31 40.31V429.48c0 22.263-18.047 40.31-40.31 40.31H148.41c-22.263 0-40.311-18.047-40.311-40.31V147.302c0-22.263 18.048-40.31 40.311-40.31zM147.556 553.478H429.73c22.263 0 40.311 18.048 40.311 40.31v282.176c0 22.263-18.048 40.312-40.31 40.312H147.555c-22.263 0-40.311-18.049-40.311-40.312V593.79c0-22.263 18.048-40.311 40.31-40.311zM593.927 106.992h282.176c22.263 0 40.31 18.048 40.31 40.31V429.48c0 22.263-18.047 40.31-40.31 40.31H593.927c-22.263 0-40.311-18.047-40.311-40.31V147.302c0-22.263 18.048-40.31 40.31-40.31zM730.22 920.502H623.926c-40.925 0-74.22-33.388-74.22-74.425V623.992c0-41.038 33.387-74.424 74.425-74.424h222.085c41.038 0 74.424 33.226 74.424 74.067v114.233c0 10.244-8.304 18.548-18.547 18.548s-18.548-8.304-18.548-18.548V623.635c0-20.388-16.746-36.974-37.33-36.974H624.13c-20.585 0-37.331 16.747-37.331 37.33v222.086c0 20.585 16.654 37.331 37.126 37.331H730.22c10.243 0 18.547 8.304 18.547 18.547 0 10.244-8.304 18.547-18.547 18.547z">
                </path>
              </svg><span class="page-category-item clickable" role="navigation">算法妙用</span>
              <meta property="articleSection" content="算法妙用">
            </span><span class="page-tag-info" aria-label="标签"><svg xmlns="http://www.w3.org/2000/svg"
                class="icon tag-icon" viewBox="0 0 1024 1024" fill="currentColor" aria-label="tag icon">
                <path
                  d="M939.902 458.563L910.17 144.567c-1.507-16.272-14.465-29.13-30.737-30.737L565.438 84.098h-.402c-3.215 0-5.726 1.005-7.634 2.913l-470.39 470.39a10.004 10.004 0 000 14.164l365.423 365.424c1.909 1.908 4.42 2.913 7.132 2.913s5.223-1.005 7.132-2.913l470.39-470.39c2.01-2.11 3.014-5.023 2.813-8.036zm-240.067-72.121c-35.458 0-64.286-28.828-64.286-64.286s28.828-64.285 64.286-64.285 64.286 28.828 64.286 64.285-28.829 64.286-64.286 64.286z">
                </path>
              </svg><span class="page-tag-item clickable" role="navigation">算法妙用</span>
              <meta property="keywords" content="算法妙用">
            </span></div>
          <hr>
        </div>
        <div class="toc-place-holder">
          <aside id="toc"><!---->
            <div class="toc-header">此页内容<!----></div>
            <div class="toc-wrapper">
              <ul class="toc-list">
                <li class="toc-item"><a class="vp-link toc-link level2 toc-link level2"
                    href="https://bbruceyuan.com/post/9.html#_1-%E7%9C%9F%E6%AD%A3%E7%9A%84qeury%E5%8F%AC%E5%9B%9E%E7%9A%84%E5%A4%9A%E6%A0%B7%E6%80%A7">1.
                    真正的Qeury召回的多样性</a></li><!---->
                <li class="toc-item"><a class="vp-link toc-link level2 toc-link level2"
                    href="https://bbruceyuan.com/post/9.html#_2-%E6%88%91%E4%BB%AC%E6%89%80%E9%9D%A2%E4%B8%B4%E7%9A%84%E5%8F%AC%E5%9B%9E%E5%A4%9A%E6%A0%B7%E6%80%A7%E9%97%AE%E9%A2%98">2.
                    我们所面临的召回多样性问题？</a></li><!---->
                <li class="toc-item"><a class="vp-link toc-link level2 toc-link level2"
                    href="https://bbruceyuan.com/post/9.html#_3-%E5%88%86%E6%9E%90query%E5%8F%91%E7%8E%B0%E7%9A%84%E9%97%AE%E9%A2%98">3.
                    分析Query发现的问题？</a></li><!---->
                <li class="toc-item"><a class="vp-link toc-link level2 toc-link level2"
                    href="https://bbruceyuan.com/post/9.html#_4-%E8%B6%B3%E5%A4%9F%E7%AE%80%E5%8D%95%E7%9A%84%E6%96%B9%E6%B3%95">4.
                    足够简单的方法</a></li>
                <li>
                  <ul class="toc-list">
                    <li class="toc-item"><a class="vp-link toc-link level3 toc-link level3"
                        href="https://bbruceyuan.com/post/9.html#_4-1-question-id%E5%A4%9A%E6%A0%B7%E5%8C%96">4.1
                        Question id多样化</a></li><!---->
                    <li class="toc-item"><a class="vp-link toc-link level3 toc-link level3"
                        href="https://bbruceyuan.com/post/9.html#_4-2-%E4%BD%BF%E7%94%A8%E6%9C%80%E5%B0%8F%E7%BC%96%E8%BE%91%E8%B7%9D%E7%A6%BB%E9%80%89%E6%8B%A9query">4.2
                        使用最小编辑距离选择Query</a></li><!---->
                  </ul>
                </li>
              </ul>
              <div class="toc-marker" style="top: -1.7rem;"></div>
            </div><!---->
          </aside>
        </div><!---->
        <div class="theme-hope-content">
          <h2 id="_1-真正的qeury召回的多样性" tabindex="-1"><a class="header-anchor"
              href="https://bbruceyuan.com/post/9.html#_1-%E7%9C%9F%E6%AD%A3%E7%9A%84qeury%E5%8F%AC%E5%9B%9E%E7%9A%84%E5%A4%9A%E6%A0%B7%E6%80%A7"
              aria-hidden="true">#</a> 1. 真正的Qeury召回的多样性</h2>
          <p>对于用的输入的Qeury，对于不同用户输入的同一个Qeury，理论上每一个人感兴趣的点可能是不一样的，所以说可以返回一些多样性的答案来达到满足更多用户需求的目的。</p>
          <h2 id="_2-我们所面临的召回多样性问题" tabindex="-1"><a class="header-anchor"
              href="https://bbruceyuan.com/post/9.html#_2-%E6%88%91%E4%BB%AC%E6%89%80%E9%9D%A2%E4%B8%B4%E7%9A%84%E5%8F%AC%E5%9B%9E%E5%A4%9A%E6%A0%B7%E6%80%A7%E9%97%AE%E9%A2%98"
              aria-hidden="true">#</a> 2. 我们所面临的召回多样性问题？</h2>
          <p>我们现在面临的是一个游戏领域的QA问题，采用的方案是比较传统的检索加召回两段式模型。TODO</p>
          <h2 id="_3-分析query发现的问题" tabindex="-1"><a class="header-anchor"
              href="https://bbruceyuan.com/post/9.html#_3-%E5%88%86%E6%9E%90query%E5%8F%91%E7%8E%B0%E7%9A%84%E9%97%AE%E9%A2%98"
              aria-hidden="true">#</a> 3. 分析Query发现的问题？</h2>
          <p>在分析业务数据的时候，发现有两种比较典型的问题：</p>
          <p>第一种是召回模型检索的出来的Query都是比较相似的，因为QA库里面的Qeury比较丰富，所以我们的模型能发现很多比较相似的Query，假设用户输入的Query是”Hello world"，那么检索出来的模型可能是
            1. hello world 2. hello world! 3. hrllo world! 4. hallo world! 5. hello
            word。那么对于这一个召回模型来说，其实是不合理的，并不需要这么一样的Clauster Question Query, 只要有一两个就OK了。</p>
          <p>第二种是召回模型检索出来的Query都是属于一个簇的，但是这些Query在语言形态上并不是一致，比如用户的input query是“hi", 那么检索出来的Query可能是 1. hello 2. hi 3. 你好
            4. Bonjour 5. こんにちは。那么对于这种不同语言，但是在语义空间上比较相似的Query，其实只要选择一两个，用于后续的精排就可以了。</p>
          <h2 id="_4-足够简单的方法" tabindex="-1"><a class="header-anchor"
              href="https://bbruceyuan.com/post/9.html#_4-%E8%B6%B3%E5%A4%9F%E7%AE%80%E5%8D%95%E7%9A%84%E6%96%B9%E6%B3%95"
              aria-hidden="true">#</a> 4. 足够简单的方法</h2>
          <h3 id="_4-1-question-id多样化" tabindex="-1"><a class="header-anchor"
              href="https://bbruceyuan.com/post/9.html#_4-1-question-id%E5%A4%9A%E6%A0%B7%E5%8C%96"
              aria-hidden="true">#</a> 4.1 Question id多样化</h3>
          <p>据统计，有超过10%的数据，top 16的query的question id都是一样的。那么我们可以加入如果有10个query的Question id都一样了，那么可以一次召回后续的其它Question
            id的Query。</p>
          <h3 id="_4-2-使用最小编辑距离选择query" tabindex="-1"><a class="header-anchor"
              href="https://bbruceyuan.com/post/9.html#_4-2-%E4%BD%BF%E7%94%A8%E6%9C%80%E5%B0%8F%E7%BC%96%E8%BE%91%E8%B7%9D%E7%A6%BB%E9%80%89%E6%8B%A9query"
              aria-hidden="true">#</a> 4.2 使用最小编辑距离选择Query</h3>
          <p>对于第一种情况，可以使用最小编辑距离选择合适的Query。</p>
        </div><!---->
        <footer class="page-meta">
          <div class="meta-item edit-link"><a
              href="https://github.com/bbruceyuan/bbruceyuan.github.io/edit/main/docs/post/%E6%8A%80%E6%9C%AF/9.%E7%AE%80%E5%8D%95%E6%96%B9%E6%B3%95%E5%A2%9E%E5%8A%A0Query%E5%8F%AC%E5%9B%9E%E7%9A%84%E5%A4%9A%E6%A0%B7%E6%80%A7.md"
              rel="noopener noreferrer" target="_blank" aria-label="编辑此页" class="nav-link label"><svg
                xmlns="http://www.w3.org/2000/svg" class="icon edit-icon" viewBox="0 0 1024 1024" fill="currentColor"
                aria-label="edit icon">
                <path
                  d="M430.818 653.65a60.46 60.46 0 0 1-50.96-93.281l71.69-114.012 7.773-10.365L816.038 80.138A60.46 60.46 0 0 1 859.225 62a60.46 60.46 0 0 1 43.186 18.138l43.186 43.186a60.46 60.46 0 0 1 0 86.373L588.879 565.55l-8.637 8.637-117.466 68.234a60.46 60.46 0 0 1-31.958 11.229z">
                </path>
                <path
                  d="M728.802 962H252.891A190.883 190.883 0 0 1 62.008 771.98V296.934a190.883 190.883 0 0 1 190.883-192.61h267.754a60.46 60.46 0 0 1 0 120.92H252.891a69.962 69.962 0 0 0-69.098 69.099V771.98a69.962 69.962 0 0 0 69.098 69.098h475.911A69.962 69.962 0 0 0 797.9 771.98V503.363a60.46 60.46 0 1 1 120.922 0V771.98A190.883 190.883 0 0 1 728.802 962z">
                </path>
              </svg>编辑此页<span><svg class="external-link-icon" xmlns="http://www.w3.org/2000/svg" aria-hidden="true"
                  focusable="false" x="0px" y="0px" viewBox="0 0 100 100" width="15" height="15">
                  <path fill="currentColor"
                    d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z">
                  </path>
                  <polygon fill="currentColor"
                    points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9">
                  </polygon>
                </svg><span class="external-link-icon-sr-only">open in new window</span></span><!----></a></div>
          <div class="meta-item git-info">
            <div class="update-time"><span class="label">上次编辑于: </span><span class="info">2023/12/22 21:37:03</span>
            </div><!---->
          </div>
        </footer>
        <nav class="vp-page-nav"><a aria-label="01之间均匀分区取两点构成三角形的概率-证明加代码实现" class="vp-link nav-link prev nav-link prev"
            href="https://bbruceyuan.com/post/8.html">
            <div class="hint"><span class="arrow start"></span>上一页</div>
            <div class="link"><!---->01之间均匀分区取两点构成三角形的概率-证明加代码实现</div>
          </a><a aria-label="Python实现蓄水池算法" class="vp-link nav-link next nav-link next"
            href="https://bbruceyuan.com/post/10.html">
            <div class="hint">下一页<span class="arrow end"></span></div>
            <div class="link">Python实现蓄水池算法<!----></div>
          </a></nav>
        <div id="comment" class="giscus-wrapper input-top" style="display: block;"><giscus-widget
            host="https://giscus.app" strict="1" reactionsenabled="1" emitmetadata="0" inputposition="top"
            theme="https://unpkg.com/vuepress-theme-hope@2.0.0-rc.2/templates/giscus/light.css" lang="zh-CN"
            loading="lazy" repo="bbruceyuan/bbruceyuan.github.io" repoid="MDEwOlJlcG9zaXRvcnkyNDU3Njc0NzU="
            category="Announcements" categoryid="DIC_kwDODqYdM84Cbg9U" mapping="pathname" term="/post/9.html"><template
              shadowrootmode="open"><!---->
              <iframe title="Comments" scrolling="no" class="" allow="clipboard-write" part="iframe"
                src="https://giscus.app/zh-CN/widget?origin=https%3A%2F%2Fbbruceyuan.com%2Fpost%2F9.html&amp;session=7151e9e363b1484b9658189eK96%2FH6rneSAWY63m2HKtF3HXMc5GIn2g3HNgxKEDbwa%2BofeC%2BkSHGYsjBMl6gPOg8IPnh1QcV%2FBrC288pGfWDtOznn8nn2%2BGeuJxvOwM6LIP9rUISXJT9cNoyao%3D&amp;repo=bbruceyuan%2Fbbruceyuan.github.io&amp;repoId=MDEwOlJlcG9zaXRvcnkyNDU3Njc0NzU%3D&amp;category=Announcements&amp;categoryId=DIC_kwDODqYdM84Cbg9U&amp;term=post%2F9&amp;number=&amp;strict=1&amp;reactionsEnabled=1&amp;emitMetadata=0&amp;inputPosition=top&amp;theme=https%3A%2F%2Funpkg.com%2Fvuepress-theme-hope%402.0.0-rc.2%2Ftemplates%2Fgiscus%2Flight.css&amp;description=%E4%BD%BF%E7%94%A8%E7%AE%80%E5%8D%95%E6%96%B9%E6%B3%95%E5%A2%9E%E5%8A%A0Query%E5%8F%AC%E5%9B%9E%E7%9A%84%E5%A4%9A%E6%A0%B7%E6%80%A7&amp;backLink=https%3A%2F%2Fbbruceyuan.com%2Fpost%2F9.html"
                loading="lazy" style="height: 372px;"></iframe>
            </template></giscus-widget></div><!---->
      </main>
      <footer class="vp-footer-wrapper">
        <div class="vp-footer">
          <script async="" src="./增加query多样性_files/busuanzi.pure.mini.js"></script>本站总访问量<span
            id="busuanzi_value_site_pv"></span>次,本站访客数<span id="busuanzi_value_site_uv"></span>人次
        </div>
        <div class="vp-copyright">Copyright © 2023 bbruceyuan</div>
      </footer>
    </div><!----><!----><!--]-->
  </div>
  <script type="module" src="./增加query多样性_files/app-8qgy8Op5.js" defer=""></script>


  <script async="" src="./增加query多样性_files/script.js" data-website-id="49c459cd-c18c-4d96-bde9-e6f3bb5517e9"></script>
  <div id="message-container"></div>
</body>
<div>
  <div class="cubox-extension-helper-button" style="display: none;">
    <svg width="18" height="18" viewBox="0 0 18 18" fill="none" xmlns="http://www.w3.org/2000/svg">
      <g clip-path="url(#clip0_1219_9015)">
        <mask id="mask0_1219_9015" style="mask-type:alpha" maskUnits="userSpaceOnUse" x="1" y="1" width="16"
          height="16">
          <path
            d="M9.77158 1.35001C13.0094 1.35001 14.6283 1.35001 15.6341 2.35586C16.64 3.36172 16.64 4.98062 16.64 8.21842V9.77158C16.64 13.0094 16.64 14.6283 15.6341 15.6341C14.6283 16.64 13.0094 16.64 9.77158 16.64H8.21842C4.98062 16.64 3.36172 16.64 2.35586 15.6341C1.35001 14.6283 1.35001 13.0094 1.35001 9.77158L1.35001 8.21842C1.35001 4.98062 1.35001 3.36172 2.35586 2.35586C3.36172 1.35001 4.98062 1.35001 8.21842 1.35001L9.77158 1.35001Z"
            fill="#D9D9D9"></path>
        </mask>
        <g mask="url(#mask0_1219_9015)">
          <ellipse cx="8.52658" cy="11.8882" rx="0.433911" ry="0.508873" fill="black"></ellipse>
          <ellipse cx="6.0803" cy="11.8883" rx="0.433911" ry="0.508873" fill="black"></ellipse>
          <path fill-rule="evenodd" clip-rule="evenodd"
            d="M14.6727 14.412C14.6047 18.3796 12.1926 18.3772 9.0904 18.3743L8.832 18.3741C5.60628 18.3741 3.93861 17.6814 3.93861 14.161C3.93861 10.4926 5.60628 7.76974 8.832 7.76974C12.0577 7.76974 14.6727 10.7436 14.6727 14.412ZM9.8879 11.8935C9.8879 12.5374 9.40796 13.0594 8.81593 13.0594C8.2239 13.0594 7.74397 12.5374 7.74397 11.8935C7.74397 11.2496 8.2239 10.7276 8.81593 10.7276C9.40796 10.7276 9.8879 11.2496 9.8879 11.8935ZM6.33438 13.0593C6.907 13.0593 7.3712 12.5374 7.3712 11.8935C7.3712 11.2496 6.907 10.7276 6.33438 10.7276C5.76176 10.7276 5.29756 11.2496 5.29756 11.8935C5.29756 12.5374 5.76176 13.0593 6.33438 13.0593Z"
            fill="black"></path>
        </g>
        <path
          d="M9.77158 2.00975C11.4091 2.00975 12.5709 2.01115 13.4519 2.1296C14.314 2.2455 14.8077 2.46246 15.1676 2.82237C15.5275 3.18229 15.7445 3.67605 15.8604 4.53807C15.9789 5.41908 15.9803 6.58087 15.9803 8.21842V9.77158C15.9803 11.4091 15.9789 12.5709 15.8604 13.4519C15.7445 14.314 15.5275 14.8077 15.1676 15.1676C14.8077 15.5275 14.314 15.7445 13.4519 15.8604C12.5709 15.9789 11.4091 15.9803 9.77158 15.9803H8.21842C6.58087 15.9803 5.41908 15.9789 4.53807 15.8604C3.67605 15.7445 3.18229 15.5275 2.82237 15.1676C2.46246 14.8077 2.2455 14.314 2.1296 13.4519C2.01115 12.5709 2.00975 11.4091 2.00975 9.77158V8.21842C2.00975 6.58087 2.01115 5.41908 2.1296 4.53807C2.2455 3.67605 2.46246 3.18229 2.82237 2.82237C3.18229 2.46246 3.67605 2.2455 4.53807 2.1296C5.41908 2.01115 6.58087 2.00975 8.21842 2.00975H9.77158Z"
          stroke="black" stroke-width="1.3195"></path>
      </g>
      <defs>
        <clippath id="clip0_1219_9015">
          <rect width="15.29" height="15.29" fill="white" transform="translate(1.35001 1.35001)"></rect>
        </clippath>
      </defs>
    </svg>
  </div>
</div>

</html>